https://frank198978104.github.io/js/main.js

1/**
2 * some JavaScript code for this blog theme
3 */
4/* jshint asi:true */
5
6/////////////////////////header////////////////////////////
7/**
8 * clickMenu
9 */
10(function() {
11  if (window.innerWidth <= 930) {
12    var menuBtn = document.querySelector('#headerMenu')
13    var nav = document.querySelector('#headerNav')
14    menuBtn.onclick = function(e) {
15      e.stopPropagation()
16      if (menuBtn.classList.contains('active')) {
17        menuBtn.classList.remove('active')
18        nav.classList.remove('nav-show')
19      } else {
20        nav.classList.add('nav-show')
21        menuBtn.classList.add('active')
22      }
23    }
24    document.querySelector('body').addEventListener('click', function() {
25      nav.classList.remove('nav-show')
26      menuBtn.classList.remove('active')
27    })
28  }
29}());
30
31//////////////////////////back to top////////////////////////////
32(function() {
33  var backToTop = document.querySelector('.back-to-top')
34  var backToTopA = document.querySelector('.back-to-top a')
35  // console.log(backToTop);
36  window.addEventListener('scroll', function() {
37
38    // 頁面頂部滾進去的距離
39    var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop)
40
41    if (scrollTop > 200) {
42      backToTop.classList.add('back-to-top-show')
43    } else {
44      backToTop.classList.remove('back-to-top-show')
45    }
46  })
47
48  // backToTopA.addEventListener('click',function (e) {
49  //     e.preventDefault()
50  //     window.scrollTo(0,0)
51  // })
52}());
53
54//////////////////////////hover on demo//////////////////////////////
55(function() {
56  var demoItems = document.querySelectorAll('.grid-item')
57}());