No Description
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

main.js 42KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448
  1. (function ($) {
  2. "use strict";
  3. /*--
  4. Menu Stick
  5. -----------------------------------*/
  6. var header = $('.sticky-bar');
  7. var win = $(window);
  8. let ele_page = $("body").hasClass("product_pg");
  9. if(ele_page == true){
  10. }
  11. function naChanges(){
  12. $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff");
  13. }
  14. setTimeout(naChanges, 1000);
  15. win.on('scroll', function() {
  16. var scroll = win.scrollTop();
  17. if (scroll < 100) {
  18. header.removeClass('stick');
  19. $(".header-bottom.sticky-bar.stick").removeClass("sticky-bar stick");
  20. let img_src = `./dist/assets/imgs/anwi-logo-2.png`;
  21. $(".logo-menu-wrap").find("a img").attr("src",img_src);
  22. $(".main-menu").find("nav ul li a").addClass("text-white");
  23. $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff");
  24. } else {
  25. header.addClass('stick');
  26. $(".header-bottom").addClass("sticky-bar stick");
  27. let src = `./dist/assets/imgs/anwi-logo-1.png`;
  28. $(".logo-menu-wrap").find("a img").attr("src",src);
  29. $(".main-menu").find("nav ul li a").removeClass("text-white");
  30. $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","currentcolor");
  31. }
  32. });
  33. /*--------------------------------
  34. Slider active 1
  35. -----------------------------------*/
  36. $('.slider-active-1').slick({
  37. slidesToShow: 1,
  38. slidesToScroll: 1,
  39. fade: true,
  40. loop: true,
  41. dots: false,
  42. arrows: true,
  43. prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
  44. nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
  45. responsive: [{
  46. breakpoint: 1500,
  47. settings: {
  48. slidesToShow: 1,
  49. slidesToScroll: 1,
  50. }
  51. },
  52. {
  53. breakpoint: 1199,
  54. settings: {
  55. slidesToShow: 1,
  56. slidesToScroll: 1,
  57. }
  58. },
  59. {
  60. breakpoint: 991,
  61. settings: {
  62. slidesToShow: 1,
  63. slidesToScroll: 1,
  64. }
  65. },
  66. {
  67. breakpoint: 767,
  68. settings: {
  69. autoplay: false,
  70. slidesToShow: 1,
  71. slidesToScroll: 1,
  72. }
  73. }
  74. ]
  75. });
  76. /*--------------------------------
  77. Slider active 2
  78. -----------------------------------*/
  79. $('.slider-active-2').slick({
  80. slidesToShow: 1,
  81. slidesToScroll: 1,
  82. fade: true,
  83. loop: true,
  84. dots: true,
  85. arrows: false,
  86. prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
  87. nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
  88. responsive: [{
  89. breakpoint: 1500,
  90. settings: {
  91. slidesToShow: 1,
  92. slidesToScroll: 1,
  93. }
  94. },
  95. {
  96. breakpoint: 1199,
  97. settings: {
  98. slidesToShow: 1,
  99. slidesToScroll: 1,
  100. }
  101. },
  102. {
  103. breakpoint: 991,
  104. settings: {
  105. slidesToShow: 1,
  106. slidesToScroll: 1,
  107. }
  108. },
  109. {
  110. breakpoint: 767,
  111. settings: {
  112. autoplay: false,
  113. slidesToShow: 1,
  114. slidesToScroll: 1,
  115. }
  116. }
  117. ]
  118. });
  119. /*--
  120. Slider active 3
  121. -----------------------------------*/
  122. $('.slider-active-3').slick({
  123. arrows: false,
  124. infinite: true,
  125. slidesToShow: 1,
  126. dots: true,
  127. fade: true,
  128. autoplay: false,
  129. autoplaySpeed: 5000,
  130. customPaging : function(slider, i) {
  131. var thumb = $(slider.$slides[i]).data('thumb');
  132. return '<button class="overlay"><img src="'+thumb+'"></button>';
  133. },
  134. responsive: [
  135. {
  136. breakpoint: 767,
  137. settings: {
  138. dots: true,
  139. autoplay: false,
  140. autoplaySpeed: 5000,
  141. }
  142. }
  143. ]
  144. });
  145. /*--------------------------------
  146. slider active 4
  147. -----------------------------------*/
  148. $('.slider-active-4').slick({
  149. slidesToShow: 1,
  150. slidesToScroll: 1,
  151. fade: true,
  152. loop: true,
  153. dots: true,
  154. arrows: false,
  155. prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
  156. nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
  157. responsive: [{
  158. breakpoint: 1500,
  159. settings: {
  160. slidesToShow: 1,
  161. slidesToScroll: 1,
  162. }
  163. },
  164. {
  165. breakpoint: 1199,
  166. settings: {
  167. slidesToShow: 1,
  168. slidesToScroll: 1,
  169. }
  170. },
  171. {
  172. breakpoint: 991,
  173. settings: {
  174. slidesToShow: 1,
  175. slidesToScroll: 1,
  176. }
  177. },
  178. {
  179. breakpoint: 767,
  180. settings: {
  181. autoplay: false,
  182. slidesToShow: 1,
  183. slidesToScroll: 1,
  184. }
  185. }
  186. ]
  187. });
  188. /*--------------------------------
  189. Slider active 5
  190. -----------------------------------*/
  191. $('.slider-active-5').slick({
  192. slidesToShow: 1,
  193. slidesToScroll: 1,
  194. fade: true,
  195. loop: true,
  196. dots: true,
  197. arrows: false,
  198. prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
  199. nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
  200. });
  201. /*--------------------------------
  202. Product slider active 1
  203. -----------------------------------*/
  204. $('.product-slider-active-1').slick({
  205. slidesToShow: 3,
  206. slidesToScroll: 1,
  207. loop: true,
  208. dots: false,
  209. arrows: false,
  210. responsive: [{
  211. breakpoint: 1500,
  212. settings: {
  213. slidesToShow: 3,
  214. slidesToScroll: 1,
  215. }
  216. },
  217. {
  218. breakpoint: 1199,
  219. settings: {
  220. slidesToShow: 3,
  221. slidesToScroll: 1,
  222. }
  223. },
  224. {
  225. breakpoint: 991,
  226. settings: {
  227. slidesToShow: 2,
  228. slidesToScroll: 1,
  229. }
  230. },
  231. {
  232. breakpoint: 767,
  233. settings: {
  234. autoplay: false,
  235. slidesToShow: 2,
  236. slidesToScroll: 1,
  237. }
  238. },
  239. {
  240. breakpoint: 575,
  241. settings: {
  242. autoplay: false,
  243. slidesToShow: 1,
  244. slidesToScroll: 1,
  245. }
  246. }
  247. ]
  248. });
  249. /*--------------------------------
  250. Product slider active 2
  251. -----------------------------------*/
  252. $('.product-slider-active-2').slick({
  253. slidesToShow: 6,
  254. slidesToScroll: 1,
  255. loop: true,
  256. dots: false,
  257. arrows: false,
  258. responsive: [{
  259. breakpoint: 1500,
  260. settings: {
  261. slidesToShow: 6,
  262. slidesToScroll: 1,
  263. }
  264. },
  265. {
  266. breakpoint: 1199,
  267. settings: {
  268. slidesToShow: 4,
  269. slidesToScroll: 1,
  270. }
  271. },
  272. {
  273. breakpoint: 991,
  274. settings: {
  275. slidesToShow: 3,
  276. slidesToScroll: 1,
  277. }
  278. },
  279. {
  280. breakpoint: 767,
  281. settings: {
  282. autoplay: false,
  283. slidesToShow: 2,
  284. slidesToScroll: 1,
  285. }
  286. },
  287. {
  288. breakpoint: 575,
  289. settings: {
  290. autoplay: false,
  291. slidesToShow: 1,
  292. slidesToScroll: 1,
  293. }
  294. }
  295. ]
  296. });
  297. /*--------------------------------
  298. Product slider active 3
  299. -----------------------------------*/
  300. $('.product-slider-active-3').slick({
  301. slidesToShow: 2,
  302. slidesToScroll: 1,
  303. loop: true,
  304. dots: false,
  305. arrows: false,
  306. responsive: [{
  307. breakpoint: 1500,
  308. settings: {
  309. slidesToShow: 2,
  310. slidesToScroll: 1,
  311. }
  312. },
  313. {
  314. breakpoint: 1199,
  315. settings: {
  316. slidesToShow: 1,
  317. slidesToScroll: 1,
  318. }
  319. },
  320. {
  321. breakpoint: 991,
  322. settings: {
  323. slidesToShow: 1,
  324. slidesToScroll: 1,
  325. }
  326. },
  327. {
  328. breakpoint: 767,
  329. settings: {
  330. autoplay: false,
  331. slidesToShow: 1,
  332. slidesToScroll: 1,
  333. }
  334. },
  335. {
  336. breakpoint: 575,
  337. settings: {
  338. autoplay: false,
  339. slidesToShow: 1,
  340. slidesToScroll: 1,
  341. }
  342. }
  343. ]
  344. });
  345. /*--------------------------------
  346. Product slider active 4
  347. -----------------------------------*/
  348. $('.product-slider-active-4').slick({
  349. slidesToShow: 4,
  350. slidesToScroll: 1,
  351. loop: true,
  352. dots: false,
  353. arrows: false,
  354. responsive: [{
  355. breakpoint: 1500,
  356. settings: {
  357. slidesToShow: 4,
  358. slidesToScroll: 1,
  359. }
  360. },
  361. {
  362. breakpoint: 1199,
  363. settings: {
  364. slidesToShow: 3,
  365. slidesToScroll: 1,
  366. }
  367. },
  368. {
  369. breakpoint: 991,
  370. settings: {
  371. slidesToShow: 2,
  372. slidesToScroll: 1,
  373. }
  374. },
  375. {
  376. breakpoint: 767,
  377. settings: {
  378. autoplay: false,
  379. slidesToShow: 2,
  380. slidesToScroll: 1,
  381. }
  382. },
  383. {
  384. breakpoint: 575,
  385. settings: {
  386. autoplay: false,
  387. slidesToShow: 1,
  388. slidesToScroll: 1,
  389. }
  390. }
  391. ]
  392. });
  393. /*--------------------------------
  394. Brand logo active
  395. -----------------------------------*/
  396. $('.brand-logo-active , .brand-logo-active-2').slick({
  397. slidesToShow: 6,
  398. slidesToScroll: 1,
  399. loop: true,
  400. dots: false,
  401. arrows: false,
  402. responsive: [{
  403. breakpoint: 1500,
  404. settings: {
  405. slidesToShow: 6,
  406. slidesToScroll: 1,
  407. }
  408. },
  409. {
  410. breakpoint: 1199,
  411. settings: {
  412. slidesToShow: 5,
  413. slidesToScroll: 1,
  414. }
  415. },
  416. {
  417. breakpoint: 991,
  418. settings: {
  419. slidesToShow: 4,
  420. slidesToScroll: 1,
  421. }
  422. },
  423. {
  424. breakpoint: 767,
  425. settings: {
  426. autoplay: false,
  427. slidesToShow: 3,
  428. slidesToScroll: 1,
  429. }
  430. },
  431. {
  432. breakpoint: 575,
  433. settings: {
  434. autoplay: false,
  435. slidesToShow: 2,
  436. slidesToScroll: 1,
  437. }
  438. }
  439. ]
  440. });
  441. /*--------------------------------
  442. Brand logo active 3
  443. -----------------------------------*/
  444. $('.brand-logo-active-3').slick({
  445. slidesToShow: 6,
  446. slidesToScroll: 1,
  447. loop: true,
  448. dots: true,
  449. arrows: false,
  450. responsive: [{
  451. breakpoint: 1500,
  452. settings: {
  453. slidesToShow: 6,
  454. slidesToScroll: 1,
  455. }
  456. },
  457. {
  458. breakpoint: 1199,
  459. settings: {
  460. slidesToShow: 5,
  461. slidesToScroll: 1,
  462. }
  463. },
  464. {
  465. breakpoint: 991,
  466. settings: {
  467. slidesToShow: 4,
  468. slidesToScroll: 1,
  469. }
  470. },
  471. {
  472. breakpoint: 767,
  473. settings: {
  474. autoplay: false,
  475. slidesToShow: 3,
  476. slidesToScroll: 1,
  477. }
  478. },
  479. {
  480. breakpoint: 575,
  481. settings: {
  482. autoplay: false,
  483. slidesToShow: 2,
  484. slidesToScroll: 1,
  485. }
  486. }
  487. ]
  488. });
  489. /*---------------------
  490. Countdown 1
  491. --------------------- */
  492. $('.timer-1 [data-countdown]').each(function() {
  493. var $this = $(this),
  494. finalDate = $(this).data('countdown');
  495. $this.countdown(finalDate, function(event) {
  496. $this.html(event.strftime('<span class="cdown day"> <span>%-D </span><p>Days</p></span> <span class="cdown hour"> <span> %-H</span> <p>Hours</p></span> <span class="cdown minutes"><span>%M</span> <p>Minutes</p> </span>'));
  497. });
  498. });
  499. $('.timer-2 [data-countdown]').each(function() {
  500. var $this = $(this),
  501. finalDate = $(this).data('countdown');
  502. $this.countdown(finalDate, function(event) {
  503. $this.html(event.strftime('<span class="cdown day"> <span>%-D </span><p>Day</p></span> <span class="cdown hour"> <span> %-H</span> <p>Hour</p></span> <span class="cdown minutes"><span>%M</span> <p>Minute</p> </span> <span class="cdown second"><span>%S</span> <p>Second</p> </span>'));
  504. });
  505. });
  506. $('.timer-3 [data-countdown]').each(function() {
  507. var $this = $(this),
  508. finalDate = $(this).data('countdown');
  509. $this.countdown(finalDate, function(event) {
  510. $this.html(event.strftime('<span class="cdown hour"> <span> %-H</span> <p>Hour</p></span> <span class="cdown minutes"><span>%M</span> <p>Minute</p> </span> <span class="cdown second"><span>%S</span> <p>Second</p> </span>'));
  511. });
  512. });
  513. /*---------------------
  514. svg img color
  515. --------------------- */
  516. // Elements to inject
  517. var mySVGsToInject = document.querySelectorAll('img.inject-me');
  518. // Do the injection
  519. SVGInjector(mySVGsToInject);
  520. /*------ Wow Active ----*/
  521. new WOW().init();
  522. /*------------
  523. ScrollUp
  524. ------------------ */
  525. // $.scrollUp({
  526. // scrollText: '<i class="icofont-arrow-up"></i>',
  527. // easingType: 'linear',
  528. // scrollSpeed: 900,
  529. // animation: 'fade'
  530. // });
  531. /*----------------------------
  532. Cart Plus Minus Button
  533. ------------------------------ */
  534. var CartPlusMinus = $('.cart-plus-minus');
  535. CartPlusMinus.prepend('<div class="dec qtybutton">-</div>');
  536. CartPlusMinus.append('<div class="inc qtybutton">+</div>');
  537. $(".qtybutton").on("click", function() {
  538. var $button = $(this);
  539. var oldValue = $button.parent().find("input").val();
  540. if ($button.text() === "+") {
  541. var newVal = parseFloat(oldValue) + 1;
  542. } else {
  543. // Don't allow decrementing below zero
  544. if (oldValue > 0) {
  545. var newVal = parseFloat(oldValue) - 1;
  546. } else {
  547. newVal = 1;
  548. }
  549. }
  550. $button.parent().find("input").val(newVal);
  551. });
  552. /*------- Color active -----*/
  553. $('.pro-details-color-content').on('click', 'a', function(e){
  554. e.preventDefault();
  555. $(this).addClass('active').parent().siblings().children('a').removeClass('active');
  556. });
  557. /*--------------------------------
  558. Cart active
  559. -----------------------------------*/
  560. if ($('.pro-details-action').length) {
  561. var $body = $('body'),
  562. $cartWrap = $('.pro-details-action'),
  563. $cartContent = $cartWrap.find('.product-dec-social');
  564. $cartWrap.on('click', '.social', function(e) {
  565. e.preventDefault();
  566. var $this = $(this);
  567. if (!$this.parent().hasClass('show')) {
  568. $this.siblings('.product-dec-social').addClass('show').parent().addClass('show');
  569. } else {
  570. $this.siblings('.product-dec-social').removeClass('show').parent().removeClass('show');
  571. }
  572. });
  573. /*Close When Click Outside*/
  574. $body.on('click', function(e) {
  575. var $target = e.target;
  576. if (!$($target).is('.pro-details-action') && !$($target).parents().is('.pro-details-action') && $cartWrap.hasClass('show')) {
  577. $cartWrap.removeClass('show');
  578. $cartContent.removeClass('show');
  579. }
  580. });
  581. }
  582. /* Language-dropdown */
  583. $(".language-dropdown-active").on("click", function(e) {
  584. e.preventDefault();
  585. $(this).parent().find('.language-dropdown').slideToggle('medium');
  586. })
  587. /* NiceSelect */
  588. $('.nice-select').niceSelect();
  589. /*--------------------------------
  590. Testimonial active
  591. -----------------------------------*/
  592. $('.testimonial-active , .testimonial-active-2').slick({
  593. slidesToShow: 1,
  594. slidesToScroll: 1,
  595. loop: true,
  596. dots: false,
  597. arrows: false,
  598. responsive: [{
  599. breakpoint: 1500,
  600. settings: {
  601. slidesToShow: 1,
  602. slidesToScroll: 1,
  603. }
  604. },
  605. {
  606. breakpoint: 1199,
  607. settings: {
  608. slidesToShow: 1,
  609. slidesToScroll: 1,
  610. }
  611. },
  612. {
  613. breakpoint: 991,
  614. settings: {
  615. slidesToShow: 1,
  616. slidesToScroll: 1,
  617. }
  618. },
  619. {
  620. breakpoint: 767,
  621. settings: {
  622. autoplay: false,
  623. slidesToShow: 1,
  624. slidesToScroll: 1,
  625. }
  626. },
  627. {
  628. breakpoint: 575,
  629. settings: {
  630. autoplay: false,
  631. slidesToShow: 1,
  632. slidesToScroll: 1,
  633. }
  634. }
  635. ]
  636. });
  637. /*====== SidebarCart ======*/
  638. function miniCart() {
  639. var navbarTrigger = $('.cart-active'),
  640. endTrigger = $('.cart-close'),
  641. container = $('.sidebar-cart-active'),
  642. wrapper2 = $('.main-wrapper');
  643. wrapper2.prepend('<div class="body-overlay"></div>');
  644. navbarTrigger.on('click', function(e) {
  645. e.preventDefault();
  646. container.addClass('inside');
  647. wrapper2.addClass('overlay-active');
  648. });
  649. endTrigger.on('click', function() {
  650. container.removeClass('inside');
  651. wrapper2.removeClass('overlay-active');
  652. });
  653. $('.body-overlay').on('click', function() {
  654. container.removeClass('inside');
  655. wrapper2.removeClass('overlay-active');
  656. });
  657. };
  658. miniCart();
  659. /*-------------------------------
  660. Header Search Toggle
  661. -----------------------------------*/
  662. var searchToggle = $('.search-toggle');
  663. searchToggle.on('click', function(e){
  664. e.preventDefault();
  665. if($(this).hasClass('open')){
  666. $(this).removeClass('open');
  667. $(this).siblings('.search-wrap-3').removeClass('open');
  668. }else{
  669. $(this).addClass('open');
  670. $(this).siblings('.search-wrap-3').addClass('open');
  671. }
  672. })
  673. /*====== Sidebar Active ======*/
  674. function sidebarActive() {
  675. var navbarTrigger = $('.sidebar-active'),
  676. endTrigger = $('.sidebar-close'),
  677. container = $('.clickalbe-sidebar-wrapper-active'),
  678. wrapper3 = $('.main-wrapper-2');
  679. wrapper3.prepend('<div class="body-overlay-2"></div>');
  680. navbarTrigger.on('click', function(e) {
  681. e.preventDefault();
  682. container.addClass('sidebar-visible');
  683. wrapper3.addClass('overlay-active-2');
  684. });
  685. endTrigger.on('click', function() {
  686. container.removeClass('sidebar-visible');
  687. wrapper3.removeClass('overlay-active-2');
  688. });
  689. $('.body-overlay-2').on('click', function() {
  690. container.removeClass('sidebar-visible');
  691. wrapper3.removeClass('overlay-active-2');
  692. });
  693. };
  694. sidebarActive();
  695. /*====== clickable Main Menu active ======*/
  696. var $clickableMainMenu = $('.clickable-mainmenu-wrap'),
  697. $clickableSubMenu = $clickableMainMenu.find('.sub-menu-2');
  698. /*Add Toggle Button in Off Canvas Sub Menu*/
  699. $clickableSubMenu.siblings('a').append('<span class="menu-expand"><i class="fa-solid fa-plus"></i></span>');
  700. /*Close Off Canvas Sub Menu*/
  701. $clickableSubMenu.slideUp();
  702. /*Category Sub Menu Toggle*/
  703. $clickableMainMenu.on('click', 'li a, li .menu-expand', function(e) {
  704. var $this = $(this);
  705. if ($this.parent('li').hasClass('has-sub-menu') || ($this.attr('href') === '#' || $this.hasClass('menu-expand'))) {
  706. e.preventDefault();
  707. if ($this.siblings('ul:visible').length) {
  708. $this.parent('li').removeClass('active').children('ul').slideUp().siblings('a').find('.menu-expand svg').removeClass('fa-minus').addClass('fa-plus');
  709. $this.parent('li').siblings('li').removeClass('active').find('ul:visible').slideUp().siblings('a').find('.menu-expand isvg').removeClass('fa-minus').addClass(' fa-plus ');
  710. } else {
  711. $this.parent('li').addClass('active').children('ul').slideDown().siblings('a').find('.menu-expand svg').removeClass(' fa-plus ').addClass('fa-minus');
  712. $this.parent('li').siblings('li').removeClass('active').find('ul:visible').slideUp().siblings('a').find('.menu-expand svg').removeClass('fa-minus').addClass(' fa-plus ');
  713. }
  714. }
  715. });
  716. /*====== Sidebar menu Active ======*/
  717. function mobileMenuActive() {
  718. var navbarTrigger = $('.mobile-menu-button-active'),
  719. endTrigger = $('.sidebar-close'),
  720. container = $('.mobile-menu-active'),
  721. wrapper4 = $('.main-wrapper-3');
  722. wrapper4.prepend('<div class="body-overlay-3"></div>');
  723. navbarTrigger.on('click', function(e) {
  724. e.preventDefault();
  725. container.addClass('sidebar-visible');
  726. wrapper4.addClass('overlay-active-3');
  727. });
  728. endTrigger.on('click', function() {
  729. container.removeClass('sidebar-visible');
  730. wrapper4.removeClass('overlay-active-3');
  731. });
  732. $('.body-overlay-3').on('click', function() {
  733. container.removeClass('sidebar-visible');
  734. wrapper4.removeClass('overlay-active-3');
  735. });
  736. };
  737. mobileMenuActive();
  738. /*--- Language currency active ----*/
  739. $('.mobile-language-active').on('click', function(e) {
  740. e.preventDefault();
  741. $('.lang-dropdown-active').slideToggle(900);
  742. });
  743. /*------------------------------------
  744. Testimonial img slider active
  745. -----------------------------------*/
  746. $('.testimonial-img-slider-active').slick({
  747. slidesToShow: 1,
  748. slidesToScroll: 1,
  749. arrows: false,
  750. draggable: false,
  751. fade: false,
  752. asNavFor: '.testimonial-active-3',
  753. });
  754. /*--------------------------------
  755. Testimonial active 3
  756. -----------------------------------*/
  757. $('.testimonial-active-3').slick({
  758. slidesToShow: 1,
  759. slidesToScroll: 1,
  760. asNavFor: '.testimonial-img-slider-active , .testimonial-img-slider-active-3',
  761. dots: true,
  762. focusOnSelect: true,
  763. fade: true,
  764. arrows: false
  765. });
  766. /*----------------------------------------------------------
  767. Testimonial img slider active 3 ( home mega fashion )
  768. --------------------------------------------------------------*/
  769. $('.testimonial-img-slider-active-3').on('init afterChange',function(){
  770. const titleImg = document.querySelector('.testimonial-next-img img');
  771. const activeSlide = document.querySelector('.testimonial-img-slider.slick-current');
  772. titleImg.src = activeSlide.nextSibling.querySelector('img').src;
  773. });
  774. $('.testimonial-img-slider-active-3').slick({
  775. slidesToShow: 1,
  776. slidesToScroll: 1,
  777. arrows: false,
  778. draggable: false,
  779. fade: false,
  780. asNavFor: '.testimonial-active-3'
  781. });
  782. // Isotope active
  783. // $('.grid').imagesLoaded(function() {
  784. // // init Isotope
  785. // var $grid = $('.grid').isotope({
  786. // itemSelector: '.grid-item',
  787. // percentPosition: true,
  788. // layoutMode: 'masonry',
  789. // masonry: {
  790. // // use outer width of grid-sizer for columnWidth
  791. // columnWidth: '.grid-item',
  792. // }
  793. // });
  794. // });
  795. /*--------------------------
  796. Isotope active
  797. ---------------------------- */
  798. // $('.grid-2').imagesLoaded(function() {
  799. // // init Isotope
  800. // $('.grid-2').isotope({
  801. // itemSelector: '.grid-item-2',
  802. // percentPosition: true,
  803. // layoutMode: 'masonry',
  804. // masonry: {
  805. // // use outer width of grid-sizer for columnWidth
  806. // columnWidth: '.grid-sizer',
  807. // }
  808. // });
  809. // });
  810. /*--------------------------
  811. Isotope active
  812. ---------------------------- */
  813. // $('.grid-3').imagesLoaded(function() {
  814. // // init Isotope
  815. // $('.grid-3').isotope({
  816. // itemSelector: '.grid-item-3',
  817. // percentPosition: true,
  818. // layoutMode: 'masonry',
  819. // masonry: {
  820. // // use outer width of grid-sizer for columnWidth
  821. // columnWidth: 1,
  822. // }
  823. // });
  824. // });
  825. /*------------------------------------
  826. testimonial img slider active 2
  827. --------------------------------------*/
  828. $('.testimonial-img-slider-active-2').slick({
  829. slidesToShow: 5,
  830. slidesToScroll: 1,
  831. arrows: false,
  832. dots: false,
  833. focusOnSelect: true,
  834. draggable: false,
  835. fade: false,
  836. asNavFor: '.testimonial-active-4',
  837. responsive: [
  838. {
  839. breakpoint: 1199,
  840. settings: {
  841. slidesToShow: 4,
  842. }
  843. },
  844. {
  845. breakpoint: 991,
  846. settings: {
  847. slidesToShow: 5,
  848. }
  849. },
  850. {
  851. breakpoint: 767,
  852. settings: {
  853. slidesToShow: 3,
  854. }
  855. },
  856. {
  857. breakpoint: 575,
  858. settings: {
  859. slidesToShow: 2,
  860. }
  861. }
  862. ]
  863. });
  864. /*--------------------------------
  865. Testimonial active 4
  866. -----------------------------------*/
  867. $('.testimonial-active-4').slick({
  868. slidesToShow: 1,
  869. slidesToScroll: 1,
  870. asNavFor: '.testimonial-img-slider-active-2',
  871. dots: false,
  872. focusOnSelect: true,
  873. fade: true,
  874. arrows: false
  875. });
  876. /*--------------------------------
  877. Testimonial active 5
  878. -----------------------------------*/
  879. $('.testimonial-active-5').slick({
  880. slidesToShow: 1,
  881. slidesToScroll: 1,
  882. dots: false,
  883. fade: false,
  884. arrows: false,
  885. responsive: [{
  886. breakpoint: 1500,
  887. settings: {
  888. slidesToShow: 1,
  889. slidesToScroll: 1,
  890. }
  891. },
  892. {
  893. breakpoint: 1199,
  894. settings: {
  895. slidesToShow: 1,
  896. slidesToScroll: 1,
  897. }
  898. },
  899. {
  900. breakpoint: 991,
  901. settings: {
  902. slidesToShow: 1,
  903. slidesToScroll: 1,
  904. }
  905. },
  906. {
  907. breakpoint: 767,
  908. settings: {
  909. autoplay: true,
  910. slidesToShow: 1,
  911. slidesToScroll: 1,
  912. }
  913. }
  914. ]
  915. });
  916. /*--------------------------------
  917. Categori slider active
  918. -----------------------------------*/
  919. $('.categori-slider-active').slick({
  920. slidesToShow: 6,
  921. slidesToScroll: 1,
  922. dots: false,
  923. fade: false,
  924. arrows: false,
  925. responsive: [{
  926. breakpoint: 1500,
  927. settings: {
  928. slidesToShow: 6,
  929. slidesToScroll: 1,
  930. }
  931. },
  932. {
  933. breakpoint: 1199,
  934. settings: {
  935. slidesToShow: 6,
  936. slidesToScroll: 1,
  937. }
  938. },
  939. {
  940. breakpoint: 991,
  941. settings: {
  942. slidesToShow: 4,
  943. slidesToScroll: 1,
  944. }
  945. },
  946. {
  947. breakpoint: 767,
  948. settings: {
  949. autoplay: true,
  950. slidesToShow: 3,
  951. slidesToScroll: 1,
  952. }
  953. },
  954. {
  955. breakpoint: 575,
  956. settings: {
  957. autoplay: true,
  958. slidesToShow: 2,
  959. slidesToScroll: 1,
  960. }
  961. }
  962. ]
  963. });
  964. /*--------------------------------
  965. Testimonial active 6
  966. -----------------------------------*/
  967. $('.testimonial-active-6').slick({
  968. slidesToShow: 2,
  969. slidesToScroll: 1,
  970. dots: true,
  971. fade: false,
  972. arrows: false,
  973. responsive: [{
  974. breakpoint: 1500,
  975. settings: {
  976. slidesToShow: 2,
  977. slidesToScroll: 1,
  978. }
  979. },
  980. {
  981. breakpoint: 1199,
  982. settings: {
  983. slidesToShow: 2,
  984. slidesToScroll: 1,
  985. }
  986. },
  987. {
  988. breakpoint: 991,
  989. settings: {
  990. slidesToShow: 1,
  991. slidesToScroll: 1,
  992. }
  993. },
  994. {
  995. breakpoint: 767,
  996. settings: {
  997. autoplay: true,
  998. slidesToShow: 1,
  999. slidesToScroll: 1,
  1000. }
  1001. }
  1002. ]
  1003. });
  1004. /*--------------------------------
  1005. Product img slider active
  1006. -----------------------------------*/
  1007. $('.product-img-slider-active').slick({
  1008. slidesToShow: 1,
  1009. slidesToScroll: 1,
  1010. dots: true,
  1011. fade: false,
  1012. arrows: false,
  1013. });
  1014. /*--------------------------------
  1015. Testimonial active 7
  1016. -----------------------------------*/
  1017. $('.testimonial-active-7').slick({
  1018. slidesToShow: 1,
  1019. slidesToScroll: 1,
  1020. dots: false,
  1021. fade: false,
  1022. arrows: false,
  1023. });
  1024. /*--------------------------------
  1025. Product details 3 img slider
  1026. -----------------------------------*/
  1027. $('.product-details-3-img-slider').slick({
  1028. slidesToShow: 1,
  1029. slidesToScroll: 1,
  1030. dots: true,
  1031. loop: true,
  1032. fade: false,
  1033. arrows: false,
  1034. });
  1035. /*--------------------------------
  1036. Product details 3 img slider 2
  1037. -----------------------------------*/
  1038. $('.product-details-3-img-slider-2').slick({
  1039. slidesToShow: 1,
  1040. slidesToScroll: 1,
  1041. dots: true,
  1042. loop: true,
  1043. fade: false,
  1044. arrows: false,
  1045. });
  1046. /*====== SidebarSearch ======*/
  1047. function sidebarSearch() {
  1048. var searchTrigger = $('.search-active'),
  1049. endTriggersearch = $('.megashop-search-close'),
  1050. container = $('.main-search-active');
  1051. searchTrigger.on('click', function(e) {
  1052. e.preventDefault();
  1053. container.addClass('search-visible');
  1054. });
  1055. endTriggersearch.on('click', function() {
  1056. container.removeClass('search-visible');
  1057. });
  1058. };
  1059. sidebarSearch();
  1060. /*---------------------
  1061. Price range
  1062. --------------------- */
  1063. // var sliderrange = $('#slider-range');
  1064. // var amountprice = $('#amount');
  1065. // $(function() {
  1066. // sliderrange.slider({
  1067. // range: true,
  1068. // min: 16,
  1069. // max: 400,
  1070. // values: [0, 300],
  1071. // slide: function(event, ui) {
  1072. // amountprice.val("$" + ui.values[0] + " - $" + ui.values[1]);
  1073. // }
  1074. // });
  1075. // amountprice.val("$" + sliderrange.slider("values", 0) +
  1076. // " - $" + sliderrange.slider("values", 1));
  1077. // });
  1078. /*---------------------
  1079. Video popup
  1080. --------------------- */
  1081. // $('.video-popup').magnificPopup({
  1082. // type: 'iframe',
  1083. // mainClass: 'mfp-fade',
  1084. // removalDelay: 160,
  1085. // preloader: false,
  1086. // zoom: {
  1087. // enabled: true,
  1088. // }
  1089. // });
  1090. /*-------------------------------------
  1091. checkout one click toggle function
  1092. ---------------------------------------*/
  1093. var checked = $( '.sin-payment input:checked' )
  1094. if(checked){
  1095. $(checked).siblings( '.payment-box' ).slideDown(900);
  1096. };
  1097. $( '.sin-payment input' ).on('change', function() {
  1098. $( '.payment-box' ).slideUp(900);
  1099. $(this).siblings( '.payment-box' ).slideToggle(900);
  1100. });
  1101. /*-----------------------
  1102. Shop filter active
  1103. ------------------------- */
  1104. $('.shop-filter-active').on('click', function(e) {
  1105. e.preventDefault();
  1106. $('.product-filter-wrapper').slideToggle();
  1107. })
  1108. var shopFiltericon = $('.shop-filter-active');
  1109. shopFiltericon.on('click', function() {
  1110. $('.shop-filter-active').toggleClass('active');
  1111. })
  1112. /*--
  1113. Product details slider 2
  1114. -----------------------------------*/
  1115. $('.pro-dec-big-img-slider-2').slick({
  1116. slidesToShow: 1,
  1117. slidesToScroll: 1,
  1118. arrows: false,
  1119. draggable: false,
  1120. fade: false,
  1121. asNavFor: '.product-dec-slider-2',
  1122. });
  1123. /*--
  1124. Product details 2 slick carousel as Nav
  1125. --------------------------------------------*/
  1126. $('.product-dec-slider-2').slick({
  1127. slidesToShow: 7,
  1128. slidesToScroll: 1,
  1129. vertical: true,
  1130. asNavFor: '.pro-dec-big-img-slider-2',
  1131. dots: false,
  1132. focusOnSelect:true,
  1133. fade: false,
  1134. arrows: false,
  1135. responsive: [
  1136. {
  1137. breakpoint: 1199,
  1138. settings: {
  1139. slidesToShow: 5,
  1140. slidesToScroll: 1,
  1141. }
  1142. },
  1143. {
  1144. breakpoint: 991,
  1145. settings: {
  1146. slidesToShow: 7,
  1147. slidesToScroll: 1,
  1148. }
  1149. },
  1150. {
  1151. breakpoint: 767,
  1152. settings: {
  1153. slidesToShow: 5,
  1154. slidesToScroll: 1,
  1155. }
  1156. },
  1157. {
  1158. breakpoint: 575,
  1159. settings: {
  1160. autoplay: true,
  1161. slidesToShow: 3,
  1162. }
  1163. }
  1164. ]
  1165. });
  1166. // Instantiate EasyZoom instances
  1167. // var $easyzoom = $('.easyzoom').easyZoom();
  1168. /*--------------------------------
  1169. Product details slider 5 active
  1170. -----------------------------------*/
  1171. $('.product-details-slider-5-active').slick({
  1172. slidesToShow: 1,
  1173. slidesToScroll: 1,
  1174. dots: false,
  1175. loop: true,
  1176. fade: false,
  1177. arrows: false,
  1178. });
  1179. /*--------------------------------
  1180. Product details tab small
  1181. -----------------------------------*/
  1182. $('.product-details-tab-small').slick({
  1183. slidesToShow: 5,
  1184. slidesToScroll: 1,
  1185. dots: false,
  1186. loop: true,
  1187. fade: false,
  1188. arrows: false,
  1189. responsive: [
  1190. {
  1191. breakpoint: 767,
  1192. settings: {
  1193. slidesToShow: 3,
  1194. slidesToScroll: 1,
  1195. }
  1196. }
  1197. ]
  1198. });
  1199. /*--------------------------
  1200. Tab active
  1201. ---------------------------- */
  1202. var ProductDetailsSmall = $('.product-details-tab-small a');
  1203. ProductDetailsSmall.on('click', function(e) {
  1204. e.preventDefault();
  1205. var $href = $(this).attr('href');
  1206. ProductDetailsSmall.removeClass('active');
  1207. $(this).addClass('active');
  1208. $('.product-details-tab-large .tab-pane').removeClass('active');
  1209. $('.product-details-tab-large ' + $href).addClass('active');
  1210. })
  1211. // $('.multiple-items').slick({
  1212. // infinite: true,
  1213. // slidesToShow: 3,
  1214. // slidesToScroll: 3
  1215. // });
  1216. // $('.slider-hero').slick({
  1217. // dots: false,
  1218. // lazyLoad: 'ondemand',
  1219. // // autoplay: true,
  1220. // // autoplaySpeed: 1000,
  1221. // slidesToShow: 4,
  1222. // slidesToScroll: 1,
  1223. // responsive: [
  1224. // {
  1225. // breakpoint: 1024,
  1226. // settings: {
  1227. // slidesToShow: 3,
  1228. // slidesToScroll: 3,
  1229. // infinite: true,
  1230. // }
  1231. // },
  1232. // {
  1233. // breakpoint: 600,
  1234. // settings: {
  1235. // slidesToShow: 2,
  1236. // slidesToScroll: 2
  1237. // }
  1238. // },
  1239. // {
  1240. // breakpoint: 480,
  1241. // settings: {
  1242. // slidesToShow: 1,
  1243. // slidesToScroll: 1
  1244. // }
  1245. // },
  1246. // {
  1247. // breakpoint: 1199,
  1248. // settings: {
  1249. // slidesToShow: 5,
  1250. // slidesToScroll: 1,
  1251. // }
  1252. // },
  1253. // {
  1254. // breakpoint: 991,
  1255. // settings: {
  1256. // slidesToShow: 3,
  1257. // slidesToScroll: 1,
  1258. // }
  1259. // },
  1260. // {
  1261. // breakpoint: 767,
  1262. // settings: {
  1263. // slidesToShow: 3,
  1264. // slidesToScroll: 1,
  1265. // }
  1266. // },
  1267. // {
  1268. // breakpoint: 575,
  1269. // settings: {
  1270. // autoplay: true,
  1271. // slidesToShow: 3,
  1272. // }
  1273. // }
  1274. // // You can unslick at a given breakpoint now by adding:
  1275. // // settings: "unslick"
  1276. // // instead of a settings object
  1277. // ]
  1278. // });
  1279. //pres overview slider
  1280. $(".press_slider-hero").slick({
  1281. dots: false,
  1282. lazyLoad: 'ondemand',
  1283. // autoplay: true,
  1284. // autoplaySpeed: 1000,
  1285. slidesToShow: 1,
  1286. slidesToScroll: 1,
  1287. responsive: [
  1288. {
  1289. breakpoint: 1024,
  1290. settings: {
  1291. slidesToShow: 1,
  1292. slidesToScroll: 1,
  1293. infinite: true,
  1294. }
  1295. },
  1296. {
  1297. breakpoint: 600,
  1298. settings: {
  1299. slidesToShow: 1,
  1300. slidesToScroll: 1
  1301. }
  1302. },
  1303. {
  1304. breakpoint: 480,
  1305. settings: {
  1306. slidesToShow: 1,
  1307. slidesToScroll: 1
  1308. }
  1309. },
  1310. {
  1311. breakpoint: 1199,
  1312. settings: {
  1313. slidesToShow: 1,
  1314. slidesToScroll: 1,
  1315. }
  1316. },
  1317. {
  1318. breakpoint: 991,
  1319. settings: {
  1320. slidesToShow: 1,
  1321. slidesToScroll: 1,
  1322. }
  1323. },
  1324. {
  1325. breakpoint: 767,
  1326. settings: {
  1327. slidesToShow: 1,
  1328. slidesToScroll: 1,
  1329. }
  1330. },
  1331. {
  1332. breakpoint: 575,
  1333. settings: {
  1334. autoplay: true,
  1335. slidesToShow: 1,
  1336. }
  1337. }
  1338. ]
  1339. });
  1340. })(jQuery);