script.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785
  1. (function($) {
  2. "use strict";
  3. //Hide Loading Box (Preloader)
  4. function handlePreloader() {
  5. if($('.preloader').length){
  6. $('.preloader').delay(200).fadeOut(500);
  7. }
  8. }
  9. //Update Header Style and Scroll to Top
  10. function headerStyle() {
  11. if($('.main-header').length){
  12. var windowpos = $(window).scrollTop();
  13. var siteHeader = $('.main-header');
  14. var scrollLink = $('.scroll-top');
  15. if (windowpos >= 110) {
  16. siteHeader.addClass('fixed-header');
  17. scrollLink.addClass('open');
  18. } else {
  19. siteHeader.removeClass('fixed-header');
  20. scrollLink.removeClass('open');
  21. }
  22. }
  23. }
  24. headerStyle();
  25. //Submenu Dropdown Toggle
  26. if($('.main-header li.dropdown ul').length){
  27. $('.main-header .navigation li.dropdown').append('<div class="dropdown-btn"><span class="fa fa-angle-right"></span></div>');
  28. }
  29. //Mobile Nav Hide Show
  30. if($('.mobile-menu').length){
  31. $('.mobile-menu .menu-box').mCustomScrollbar();
  32. var mobileMenuContent = $('.main-header .menu-area .main-menu').html();
  33. $('.mobile-menu .menu-box .menu-outer').append(mobileMenuContent);
  34. $('.sticky-header .main-menu').append(mobileMenuContent);
  35. //Dropdown Button
  36. $('.mobile-menu li.dropdown .dropdown-btn').on('click', function() {
  37. $(this).toggleClass('open');
  38. $(this).prev('ul').slideToggle(500);
  39. });
  40. //Menu Toggle Btn
  41. $('.mobile-nav-toggler').on('click', function() {
  42. $('body').addClass('mobile-menu-visible');
  43. });
  44. //Menu Toggle Btn
  45. $('.mobile-menu .menu-backdrop,.mobile-menu .close-btn').on('click', function() {
  46. $('body').removeClass('mobile-menu-visible');
  47. });
  48. }
  49. // Scroll to a Specific Div
  50. if($('.scroll-to-target').length){
  51. $(".scroll-to-target").on('click', function() {
  52. var target = $(this).attr('data-target');
  53. // animate
  54. $('html, body').animate({
  55. scrollTop: $(target).offset().top
  56. }, 1000);
  57. });
  58. }
  59. // Elements Animation
  60. if($('.wow').length){
  61. var wow = new WOW({
  62. mobile: false
  63. });
  64. wow.init();
  65. }
  66. //Contact Form Validation
  67. if($('#contact-form').length){
  68. $('#contact-form').validate({
  69. rules: {
  70. username: {
  71. required: true
  72. },
  73. email: {
  74. required: true,
  75. email: true
  76. },
  77. phone: {
  78. required: true
  79. },
  80. subject: {
  81. required: true
  82. },
  83. message: {
  84. required: true
  85. }
  86. }
  87. });
  88. }
  89. //Fact Counter + Text Count
  90. if($('.count-box').length){
  91. $('.count-box').appear(function(){
  92. var $t = $(this),
  93. n = $t.find(".count-text").attr("data-stop"),
  94. r = parseInt($t.find(".count-text").attr("data-speed"), 10);
  95. if (!$t.hasClass("counted")) {
  96. $t.addClass("counted");
  97. $({
  98. countNum: $t.find(".count-text").text()
  99. }).animate({
  100. countNum: n
  101. }, {
  102. duration: r,
  103. easing: "linear",
  104. step: function() {
  105. $t.find(".count-text").text(Math.floor(this.countNum));
  106. },
  107. complete: function() {
  108. $t.find(".count-text").text(this.countNum);
  109. }
  110. });
  111. }
  112. },{accY: 0});
  113. }
  114. //LightBox / Fancybox
  115. if($('.lightbox-image').length) {
  116. $('.lightbox-image').fancybox({
  117. openEffect : 'fade',
  118. closeEffect : 'fade',
  119. helpers : {
  120. media : {}
  121. }
  122. });
  123. }
  124. //Tabs Box
  125. if($('.tabs-box').length){
  126. $('.tabs-box .tab-buttons .tab-btn').on('click', function(e) {
  127. e.preventDefault();
  128. var target = $($(this).attr('data-tab'));
  129. if ($(target).is(':visible')){
  130. return false;
  131. }else{
  132. target.parents('.tabs-box').find('.tab-buttons').find('.tab-btn').removeClass('active-btn');
  133. $(this).addClass('active-btn');
  134. target.parents('.tabs-box').find('.tabs-content').find('.tab').fadeOut(0);
  135. target.parents('.tabs-box').find('.tabs-content').find('.tab').removeClass('active-tab');
  136. $(target).fadeIn(300);
  137. $(target).addClass('active-tab');
  138. }
  139. });
  140. }
  141. //Accordion Box
  142. if($('.accordion-box').length){
  143. $(".accordion-box").on('click', '.acc-btn', function() {
  144. var outerBox = $(this).parents('.accordion-box');
  145. var target = $(this).parents('.accordion');
  146. if($(this).hasClass('active')!==true){
  147. $(outerBox).find('.accordion .acc-btn').removeClass('active');
  148. }
  149. if ($(this).next('.acc-content').is(':visible')){
  150. return false;
  151. }else{
  152. $(this).addClass('active');
  153. $(outerBox).children('.accordion').removeClass('active-block');
  154. $(outerBox).find('.accordion').children('.acc-content').slideUp(300);
  155. target.addClass('active-block');
  156. $(this).next('.acc-content').slideDown(300);
  157. }
  158. });
  159. }
  160. //11.progressBarConfig
  161. function progressBarConfig () {
  162. var progressBar = $('.progress');
  163. if(progressBar.length) {
  164. progressBar.each(function () {
  165. var Self = $(this);
  166. Self.appear(function () {
  167. var progressValue = Self.data('value');
  168. Self.find('.progress-bar').animate({
  169. width:progressValue+'%'
  170. }, 100);
  171. Self.find('span.value').countTo({
  172. from: 0,
  173. to: progressValue,
  174. speed: 100
  175. });
  176. });
  177. })
  178. }
  179. }
  180. //Sortable Masonary with Filters
  181. function enableMasonry() {
  182. if($('.sortable-masonry').length){
  183. var winDow = $(window);
  184. // Needed variables
  185. var $container=$('.sortable-masonry .items-container');
  186. var $filter=$('.filter-btns');
  187. $container.isotope({
  188. filter:'*',
  189. masonry: {
  190. columnWidth : '.masonry-item.small-column'
  191. },
  192. animationOptions:{
  193. duration:500,
  194. easing:'linear'
  195. }
  196. });
  197. // Isotope Filter
  198. $filter.find('li').on('click', function(){
  199. var selector = $(this).attr('data-filter');
  200. try {
  201. $container.isotope({
  202. filter : selector,
  203. animationOptions: {
  204. duration: 500,
  205. easing : 'linear',
  206. queue : false
  207. }
  208. });
  209. } catch(err) {
  210. }
  211. return false;
  212. });
  213. winDow.on('resize', function(){
  214. var selector = $filter.find('li.active').attr('data-filter');
  215. $container.isotope({
  216. filter : selector,
  217. animationOptions: {
  218. duration: 500,
  219. easing : 'linear',
  220. queue : false
  221. }
  222. });
  223. });
  224. var filterItemA = $('.filter-btns li');
  225. filterItemA.on('click', function(){
  226. var $this = $(this);
  227. if ( !$this.hasClass('active')) {
  228. filterItemA.removeClass('active');
  229. $this.addClass('active');
  230. }
  231. });
  232. }
  233. }
  234. enableMasonry();
  235. // Select menu
  236. function selectDropdown() {
  237. if ($(".selectmenu").length) {
  238. $(".selectmenu").selectmenu();
  239. var changeSelectMenu = function(event, item) {
  240. $(this).trigger('change', item);
  241. };
  242. $(".selectmenu").selectmenu({ change: changeSelectMenu });
  243. };
  244. }
  245. // Testimonial Carousel
  246. if ($('.testimonial-carousel').length) {
  247. $('.testimonial-carousel').owlCarousel({
  248. animateOut: 'fadeOut',
  249. animateIn: 'fadeIn',
  250. items:1,
  251. loop:true,
  252. margin:0,
  253. nav:true,
  254. smartSpeed: 300,
  255. autoplay: 3000,
  256. navText: [ '<span class="fas fa-long-arrow-alt-left"></span>', '<span class="fas fa-long-arrow-alt-right"></span>' ]
  257. });
  258. }
  259. // testimonial-carousel
  260. if ($('.testimonial-carousel-2').length) {
  261. $('.testimonial-carousel-2').owlCarousel({
  262. loop:true,
  263. margin:30,
  264. nav:false,
  265. smartSpeed: 3000,
  266. autoplay: true,
  267. navText: [ '<span class="flaticon-left"></span>', '<span class="flaticon-right"></span>' ],
  268. responsive:{
  269. 0:{
  270. items:1
  271. },
  272. 480:{
  273. items:1
  274. },
  275. 600:{
  276. items:1
  277. },
  278. 800:{
  279. items:1
  280. },
  281. 1200:{
  282. items:1
  283. }
  284. }
  285. });
  286. }
  287. // testimonial-carousel
  288. if ($('.testimonial-carousel-3').length) {
  289. $('.testimonial-carousel-3').owlCarousel({
  290. loop:true,
  291. margin:30,
  292. nav:false,
  293. smartSpeed: 3000,
  294. autoplay: true,
  295. navText: [ '<span class="fas fa-long-arrow-alt-left"></span>', '<span class="fas fa-long-arrow-alt-right"></span>' ],
  296. responsive:{
  297. 0:{
  298. items:1
  299. },
  300. 480:{
  301. items:1
  302. },
  303. 600:{
  304. items:1
  305. },
  306. 800:{
  307. items:1
  308. },
  309. 1200:{
  310. items:1
  311. }
  312. }
  313. });
  314. }
  315. // Four Item Carousel
  316. if ($('.four-item-carousel').length) {
  317. $('.four-item-carousel').owlCarousel({
  318. loop:true,
  319. margin:30,
  320. nav:true,
  321. autoHeight: true,
  322. smartSpeed: 500,
  323. autoplay: 5000,
  324. navText: [ '<span class="fas fa-angle-left"></span>', '<span class="fas fa-angle-right"></span>' ],
  325. responsive:{
  326. 0:{
  327. items:1
  328. },
  329. 600:{
  330. items:2
  331. },
  332. 800:{
  333. items:3
  334. },
  335. 1024:{
  336. items:3
  337. },
  338. 1200:{
  339. items:4
  340. }
  341. }
  342. });
  343. }
  344. // Four Item Carousel
  345. if ($('.four-item-carousel-2').length) {
  346. $('.four-item-carousel-2').owlCarousel({
  347. loop:true,
  348. margin:60,
  349. nav:true,
  350. autoHeight: true,
  351. smartSpeed: 500,
  352. autoplay: 5000,
  353. navText: [ '<span class="fas fa-angle-left"></span>', '<span class="fas fa-angle-right"></span>' ],
  354. responsive:{
  355. 0:{
  356. items:1
  357. },
  358. 600:{
  359. items:2
  360. },
  361. 800:{
  362. items:3
  363. },
  364. 1024:{
  365. items:3
  366. },
  367. 1200:{
  368. items:4
  369. }
  370. }
  371. });
  372. }
  373. //single-item-carousel
  374. if ($('.single-item-carousel').length) {
  375. $('.single-item-carousel').owlCarousel({
  376. loop:true,
  377. margin:0,
  378. nav:true,
  379. animateOut: 'fadeOut',
  380. animateIn: 'fadeIn',
  381. active: true,
  382. smartSpeed: 1000,
  383. autoplay: 6000,
  384. navText: [ '<span class="flaticon-left-arrow"></span>', '<span class="flaticon-right-arrow"></span>' ],
  385. dots: true,
  386. responsive:{
  387. 0:{
  388. items:1
  389. },
  390. 600:{
  391. items:1
  392. },
  393. 1024:{
  394. items:1
  395. }
  396. }
  397. });
  398. }
  399. // clients-carousel
  400. if ($('.clients-carousel').length) {
  401. $('.clients-carousel').owlCarousel({
  402. loop:true,
  403. margin:30,
  404. nav:false,
  405. smartSpeed: 3000,
  406. autoplay: true,
  407. navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
  408. responsive:{
  409. 0:{
  410. items:1
  411. },
  412. 480:{
  413. items:2
  414. },
  415. 600:{
  416. items:3
  417. },
  418. 800:{
  419. items:4
  420. },
  421. 1200:{
  422. items:4
  423. }
  424. }
  425. });
  426. }
  427. // clients-carousel
  428. if ($('.clients-carousel-2').length) {
  429. $('.clients-carousel-2').owlCarousel({
  430. loop:true,
  431. margin:30,
  432. nav:false,
  433. smartSpeed: 3000,
  434. autoplay: true,
  435. navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
  436. responsive:{
  437. 0:{
  438. items:1
  439. },
  440. 480:{
  441. items:2
  442. },
  443. 600:{
  444. items:3
  445. },
  446. 800:{
  447. items:4
  448. },
  449. 1200:{
  450. items:5
  451. }
  452. }
  453. });
  454. }
  455. //three-column-carousel
  456. if ($('.three-column-carousel').length) {
  457. $('.three-column-carousel').owlCarousel({
  458. loop:true,
  459. margin:30,
  460. nav:false,
  461. smartSpeed: 3000,
  462. autoplay: true,
  463. navText: [ '<span class="fas fa-arrow-left"></span>', '<span class="fas fa-arrow-right"></span>' ],
  464. responsive:{
  465. 0:{
  466. items:1
  467. },
  468. 480:{
  469. items:1
  470. },
  471. 600:{
  472. items:2
  473. },
  474. 800:{
  475. items:2
  476. },
  477. 1024:{
  478. items:3
  479. }
  480. }
  481. });
  482. }
  483. //two-column-carousel
  484. if ($('.two-column-carousel').length) {
  485. $('.two-column-carousel').owlCarousel({
  486. loop:true,
  487. margin:50,
  488. nav:true,
  489. smartSpeed: 3000,
  490. autoplay: 4000,
  491. navText: [ '<span class="fa fa-caret-left"></span>', '<span class="fa fa-caret-right"></span>' ],
  492. responsive:{
  493. 0:{
  494. items:1
  495. },
  496. 480:{
  497. items:1
  498. },
  499. 600:{
  500. items:1
  501. },
  502. 800:{
  503. items:2
  504. },
  505. 1024:{
  506. items:2
  507. }
  508. }
  509. });
  510. }
  511. if($('.paroller').length){
  512. $('.paroller').paroller({
  513. factor: 0.05, // multiplier for scrolling speed and offset, +- values for direction control
  514. factorLg: 0.05, // multiplier for scrolling speed and offset if window width is less than 1200px, +- values for direction control
  515. type: 'foreground', // background, foreground
  516. direction: 'horizontal' // vertical, horizontal
  517. });
  518. }
  519. // 6 pieChart RoundCircle
  520. function expertizeRoundCircle () {
  521. var rounderContainer = $('.piechart');
  522. if (rounderContainer.length) {
  523. rounderContainer.each(function () {
  524. var Self = $(this);
  525. var value = Self.data('value');
  526. var size = Self.parent().width();
  527. var color = Self.data('fg-color');
  528. Self.find('span').each(function () {
  529. var expertCount = $(this);
  530. expertCount.appear(function () {
  531. expertCount.countTo({
  532. from: 1,
  533. to: value*100,
  534. speed: 3000
  535. });
  536. });
  537. });
  538. Self.appear(function () {
  539. Self.circleProgress({
  540. value: value,
  541. size: 270,
  542. thickness: 30,
  543. emptyFill: '#e1e1e1',
  544. animation: {
  545. duration: 3000
  546. },
  547. fill: {
  548. color: color
  549. }
  550. });
  551. });
  552. });
  553. };
  554. }
  555. if($('.timer').length){
  556. $(function(){
  557. $('[data-countdown]').each(function() {
  558. var $this = $(this), finalDate = $(this).data('countdown');
  559. $this.countdown(finalDate, function(event) {
  560. $this.html(event.strftime('%D days %H:%M:%S'));
  561. });
  562. });
  563. });
  564. $('.cs-countdown').countdown('').on('update.countdown', function(event) {
  565. var $this = $(this).html(event.strftime('<div class="count-col"><span>%m</span><h3>Months</h3></div> <div class="count-col"><span>%D</span><h3>days</h3></div> <div class="count-col"><span>%H</span><h3>Hours</h3></div> <div class="count-col"><span>%M</span><h3>Minutes</h3></div> <div class="count-col"><span>%S</span><h3>Seconds</h3></div>'));
  566. });
  567. }
  568. //31.donate popup
  569. function donatepopup() {
  570. if($('#donate-popup').length){
  571. //Show Popup
  572. $('.donate-box-btn').on('click', function() {
  573. $('#donate-popup').addClass('popup-visible');
  574. });
  575. //Hide Popup
  576. $('.close-donate').click(function() {
  577. $('#donate-popup').removeClass('popup-visible');
  578. });
  579. }
  580. }
  581. //BX-Slider
  582. if($('.events-slide').length){
  583. $('.events-slide').bxSlider({
  584. auto:true,
  585. mode:'vertical',
  586. nextSelector: '#slider-next',
  587. nextText: '',
  588. navText: [ '<span class="fa fa-angle-left"></span>', '<span class="fa fa-angle-right"></span>' ],
  589. maxSlides: 3,
  590. minSlides: 3,
  591. moveSlides: 1,
  592. pause: 5000,
  593. speed: 700,
  594. pager: false
  595. });
  596. }
  597. function onHoverthreeDmovement() {
  598. var tiltBlock = $('.js-tilt');
  599. if(tiltBlock.length) {
  600. $('.js-tilt').tilt({
  601. maxTilt: 20,
  602. perspective:700,
  603. glare: true,
  604. maxGlare: 0
  605. })
  606. }
  607. }
  608. /* =========================================================================
  609. When document is Scrollig, do
  610. ========================================================================== */
  611. jQuery(document).on('ready', function () {
  612. (function ($) {
  613. // add your functions
  614. progressBarConfig ();
  615. selectDropdown();
  616. donatepopup();
  617. onHoverthreeDmovement();
  618. })(jQuery);
  619. });
  620. /* ==========================================================================
  621. When document is Scrollig, do
  622. ========================================================================== */
  623. $(window).on('scroll', function() {
  624. headerStyle();
  625. });
  626. /* ==========================================================================
  627. When document is loaded, do
  628. ========================================================================== */
  629. $(window).on('load', function() {
  630. // handlePreloader();
  631. enableMasonry();
  632. expertizeRoundCircle ();
  633. });
  634. })(window.jQuery);
  635. $(document).ready(function() {
  636. //서브페이지 인식해서 header 스타일변경
  637. if($(".sub_wrap").hasClass("blog") === true) {
  638. $(".main-header .outer-container").addClass("sub_header");
  639. } else {
  640. $(".main-header .outer-container").removeClass("sub_header");
  641. }
  642. //------ company_js -------//
  643. $('.company_slider_wraper .owl-carousel').owlCarousel({
  644. loop: true,
  645. margin: 10,
  646. autoplay: true,
  647. responsiveClass: true,
  648. smartSpeed: 1200,
  649. navText : ['<i class="fa fa-angle-left" aria-hidden="true"></i>','<i class="fa fa-angle-right" aria-hidden="true"></i>'],
  650. responsive: {
  651. 0: {
  652. items: 2,
  653. nav: true
  654. },
  655. 500: {
  656. items: 3,
  657. nav: true
  658. },
  659. 700: {
  660. items: 4,
  661. nav: true
  662. },
  663. 1000: {
  664. items: 5,
  665. nav: true,
  666. loop: true,
  667. margin: 20
  668. }
  669. }
  670. })
  671. });