https://www.ecpay.com.tw/Content/themes/Intro/adminappintro/js/_actions.js

1(function($){
2
3//頂部導覽效果
4    /*var HeaderHeight = $('.site-header').height();
5    $(".site-header nav a").click(function() {
6        $(".site-header nav a").removeClass('active');
7        $(this).addClass('active');
8    });*/
9
10//手機選單控制
11    // $(".global-nav-mobile .nav-mobile-icon").on("click",function(e){
12    //     e.preventDefault();
13    //     $('.global-nav-mobile .m-icon').toggleClass('m-active');
14    //     $('.global-nav-mobile ul').slideToggle(200);
15    // });
16    // $('.global-nav-mobile li').on("click",function(e){
17    //     $('.global-nav-mobile .m-icon').removeClass('m-active');
18    //     $('.global-nav-mobile ul').slideUp(200);
19    // });
20
21
22//手機觸控事件
23    var touchevent  = function(){$(this).addClass('on-touch');}
24    var touchevent2 = function(){$(this).removeClass('on-touch');}
25    $('a')
26    .on('touchstart mouseenter click', touchevent)
27    .on('touchend mouseleave click', touchevent2);
28
29
30//頂部選單固定時，選單隨左右卷軸移動
31$('.site-header').css({
32    transform: 'translateX(-' + $(this).scrollLeft() + 'px)'
33});
34$(window).scroll(function(winLeft) {
35    var winLeft = $(this).scrollLeft();
36    if(winLeft > 0) {
37        $('.site-header').css({
38            transform: 'translateX(-' + winLeft + 'px)'
39        });
40    } else if (winLeft === 0) {
41        $('.site-header').css({
42            transform: 'translateX(0px)'
43        });
44    }
45    return false;
46});
47
48//往上的按鈕
49    $(window).scroll(function(){
50        if ($(this).scrollTop() > 150) {
51            $('.scrollToTop').addClass('visible');
52        } else {
53            $('.scrollToTop').removeClass('visible');
54        }
55    });
56    //Click event to scroll to top
57    $('.scrollToTop').click(function(){
58        $('html, body').animate({scrollTop : 0},1000);
59        return false;
60    });
61
62//浮動社群連結
63    $('#floating-button').on('click', function() {
64        $('.container-floating').toggleClass('cfl-active');
65        $(this).toggleClass('is-active');
66    });
67    $(window).resize(function() {        
68        $('.container-floating').removeClass('cfl-active');
69        $('#floating-button').removeClass('is-active');
70    });
71
72//scroll ani
73    window.onload = function(){
74        $('.site-main-wrapper').addClass('ani');
75    }
76    function scsNumAct(){
77        var winScrollTop = $(window).scrollTop();
78        var scs = (scsNum) => {
79            if ($($('.se-' + scsNum)).length) {
80                var scSectionNum = $('.se-' + scsNum);
81                var scSectionTop = scSectionNum.offset().top;
82                var range = 550;
83
84                if(winScrollTop >= scSectionTop - range){
85                    $(scSectionNum).addClass('ani');
86                }
87            }
88        };
89        for (var i = 0; i <= $('.site-content-wrapper').length; i++) {
90            scs(i);
91        }
92    }
93    scsNumAct();
94    $(window).on('scroll', function(){
95        scsNumAct();
96    })
97
98
99    //區塊背景 視差滾動
100    $(window).on('scroll', function() {
101        let scrollDistance = $(window).scrollTop();
102        
103        $('.site-body').css({
104          'background-position-y': -scrollDistance * 0.6 + 'px'
105        });
106    });
107
108
109    //tab
110    $(function(){
111        var $li = $('ul.tab-title li');
112        $($li. eq(0) .addClass('active').find('a').data('tab')).show().siblings('.tab-inner').hide();
113
114        $li.click(function(){
115            $($(this).find('a').data('tab')).show().siblings ('.tab-inner').hide();
116            $(this).addClass('active').siblings('.active').removeClass('active');
117
118            // 標籤內輪播切換
119            tabSwp();
120        });
121    });
122
123
124    //ajax
125    $(function(){
126        
127        $(".global-nav-mobile .nav-mobile-icon").on("click",function(e){
128            e.preventDefault();
129            $('.global-nav-mobile .m-icon').toggleClass('m-active');
130            $('.global-nav-mobile ul').slideToggle(200);
131        });
132        $('.global-nav-mobile li').on("click",function(e){

133            $('.global-nav-mobile .m-icon').removeClass('m-active');
134            $('.global-nav-mobile ul').slideUp(200);
135        });
136
137        
138        var touchevent  = function(){$(this).addClass('on-touch');}
139        var touchevent2 = function(){$(this).removeClass('on-touch');}
140        $('a')
141        .on('touchstart mouseenter click', touchevent)
142        .on('touchend mouseleave click', touchevent2);
143
144
145        //選單滑動
146        $('.global-nav-normal a, .global-nav-mobile a, .faq-content .msl-list a').on('click', function() {
147            var $body = (window.opera) ? (document.compatMode == "CSS1Compat" ? $('html') : $('body')) : $('html,body');
148            var globalLink = $(this).attr('href');
149            var globalLinkTop = $(globalLink).offset().top;
150            var headerHeight = $('.site-header').height();
151
152            $body.animate({
153                scrollTop: globalLinkTop - headerHeight
154            }, 400);
155        });
156    //
157        let scwLength = $("[id^='scw_']").length;
158        $(window).scroll(function() {
159
160            for (let i = 0; i < scwLength; i++) {
161                let winTop = $(window).scrollTop();
162                let scwTop = $('#scw_' + i).offset().top;
163                let scwTopFirst = $('#scw_0').offset().top;
164                var scwHeight = $('#scw_' + i).height();
165                var headerHeight = $('.site-header').height();
166
167                if(winTop >= scwTop - headerHeight - 200){
168
169                    $(".global-nav-normal li").eq(i).find('a').addClass('active').parents('li').siblings().find('a').removeClass('active');
170                    $(".global-nav-mobile li").eq(i).find('a').addClass('active').parents('li').siblings().find('a').removeClass('active');
171
172                } else if (winTop < scwTopFirst - headerHeight - 50){
173
174                    $(".global-nav-normal li a").removeClass('active');
175                    $(".global-nav-mobile li a").removeClass('active');
176                }
177            }
178        });
179    });
180    
181    
182
183})(jQuery);
184
185
186
187// 輪播效果
188var swiper_slideBox = new Swiper('.ssb-box', {
189    autoplay: true,
190    speed: 1200,
191    pagination: {
192        el: '.swiper-pagination',
193        clickable: true,
194    },
195    navigation: {
196        nextEl: '.sbn-2',
197        prevEl: '.sbp-2'
198    },
199    observer: true,
200    observeParents: true,
201});