설명 없음
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 47KB

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