From 2da794cfe5c07e577be044701e3ccc7475a84d23 Mon Sep 17 00:00:00 2001 From: kenlee Date: Thu, 27 Mar 2025 20:19:28 +0800 Subject: [PATCH] 'js' --- assets/javascripts/app.js | 171 ++++++++++++++------------------------ 1 file changed, 61 insertions(+), 110 deletions(-) diff --git a/assets/javascripts/app.js b/assets/javascripts/app.js index 188e56a..73a0263 100644 --- a/assets/javascripts/app.js +++ b/assets/javascripts/app.js @@ -64,78 +64,6 @@ // } // }, - // nav: { - // 自適應使用的下拉選單 - // setDropdown: function() { - // var $caret1 = $(''); - // var $caret2 = $(''); - // var $li = null; - // var $this = null; - // var cls = 'active'; - // var iconDown = 'fa-chevron-down'; - // var iconUp = 'fa-chevron-up'; - - // // 如果有第二層選單，新增對應的類別到parent元素上 - // $('.nav-level-1') - // .parent('li') - // .addClass('has-dropdown level-1'); - - // // 檢查是否已經有dropdown-toggle-icon這個元素，才不會在resize事件中重覆新增 - // if ($('.has-dropdown.level-1 > .dropdown-toggle-icon').length < 1) { - // $caret1.appendTo('.has-dropdown.level-1'); - - // // 如果有第三層選單，新增對應的類別到parent元素上 - // $('.nav-level-2') - // .parent('li') - // .addClass('has-dropdown level-2'); - // $caret2.appendTo('.has-dropdown.level-2'); - // } - - // // 綁定事件到第二、三層下拉選單的按鈕上 - // $('.dropdown-toggle-icon.level-1, .dropdown-toggle-icon.level-2').on('vclick', function(e) { - // e.preventDefault(); - // $this = $(this); - // $li = $this.parent('li'); - - // // 拿掉所有選項除了目前點選的選項的 active class 並把icon換成預設的 - // $li - // .siblings('li') - // .removeClass(cls) - // .find('.' + iconUp) - // .removeClass(iconUp) - // .addClass(iconDown); - - - // // 換掉目前選項的icon - // $li - // .find('> i') - // .removeClass(iconDown) - // .addClass(iconUp); - - // // 折疊已打開的選項 - // if ( $li.hasClass(cls) ){ - // $li.removeClass(cls); - // $this.removeClass(iconUp).addClass(iconDown); - // } - // else{ - // $li.addClass(cls) - // $this.removeClass(iconDown).addClass(iconUp); - // } - // }); - // }, - - // 移除行動版下拉選單 - // removeDropdown: function() { - // var $nav = $('#main-nav'); - - // $nav - // .find('.dropdown-toggle-icon') - // .remove(); - // $nav - // .find('.active') - // .removeClass('active'); - // } - // }, member: { // 欄位相同高度，小心這個函數沒有計算到圖片高度，所以可能要搭配 jQuery load函數使用，或是之後使用更好的方式例如 CSS3 flexbox @@ -426,28 +354,19 @@ // 自適應網頁使用，當使用者改變瀏覽器寬度時呼叫orbit.nav.setDropdown函數 $(window).resize(function() { if ($(window).width() < 769) { - $('.navbar-toggle').click(function(e){ - e.preventDefault(); - $('.mobile-menu').toggleClass('active'); - $('body').toggleClass('noscroll'); - - $('.mobile-menu .navbar-toggle').removeClass('collapsed'); - // $menu.slideToggle(); - $('.mobile-menu1 > ul').slideUp(500); - $('.mobile-menu1 > .menu-drop').removeClass('opened'); - $('.mobile-menu2 > ul').slideUp(500); - $('.mobile-menu2 > .menu-drop').removeClass('opened'); - }) if (resizeTimer) clearTimeout(resizeTimer); resizeTimer = setTimeout(function() { - if ( $('.modules-menu i').length == 0 ) { - orbit.MobileMenu(); - } + // if ( $('.modules-menu i').length == 0 ) { + // orbit.MobileMenu(); + // } if( $('.mobile-menu .modules-menu').length == 0 ) { $('.mobile-menu').append($('.modules-menu')); $('.header-buttom').appendTo($('.modules-menu')); - $('.navbar-toggle').bind(orbit.ClickMenuHandler()); + orbit.MobileMenu(); + orbit.ClickMenuHandler(); + // $('.navbar-toggle').bind('click', orbit.ClickMenuHandler); + // $('.navbar-toggle').bind(orbit.ClickMenuHandler()); } },500 )} else { resizeTimer = setTimeout(function(){ @@ -476,34 +395,34 @@ }); //li被hover - $('li').hover( - function() { - $(this).children('ul').addClass('show'); - }, - function() { - $(this).children('ul').removeClass('show'); + function handleHover() { + if ($(window).width() > 769) { + $('li').off('mouseenter mouseleave').hover( + function() { + $(this).children('ul').addClass('show'); + }, + function() { + $(this).children('ul').removeClass('show'); + } + ); + } else { + $('li').off('mouseenter mouseleave'); // 移除 hover 事件 } - ); + } + + // 先執行一次 + handleHover(); + + // 監聽視窗大小變化 + $(window).on('resize', function() { + handleHover(); + }); //刪除空的h1 $('h1').each(function() { if ($(this).text().trim() === '') { $(this).remove(); } }); - // - // $('.epaper-index2-container h4 a').each(function() { - // var $this = $(this); - // // 取得 a 內部的純文字內容，移除前後空白 - // var textContent = $this.text().trim(); - // // 檢查 a 內部是否所有子元素都是 display: none - // var hasVisibleContent = $this.children().filter(function() { - // return $(this).css('display') !== 'none'; - // }).length > 0; - // // 如果 a 內部沒有純文字，且內部所有元素都是 display: none，則刪除該 a - // if (textContent === '' || !hasVisibleContent) { - // $this.remove(); - // } - // }); //refresh_btn加上aria-label $('#refresh_btn').each(function() { var $this = $(this); @@ -1109,7 +1028,39 @@ $(document).ready(function () { $('.header-banner').css('height', navH ); } } - headerH(); + headerH(); + //downIcon + $(".downIcon").click(function () { + var move_to_target = function (stop) { + var theTop; + if (stop) { + // $(".kenjohn").addClass('navFixed'); + if ($('.layout-content2.topcontent').length != 0 && $('.layout-content2.topcontent').offset().top < 400) { + $('.layout-content2').css('margin-top', $('.kenjohn').height() - $('#orbit-bar').height()); + } + if (parseInt($('.layout-content2').css('margin-top') == 0)) { + theTop = $('.layout-content2.topcontent').offset().top - $(".kenjohn").position().top - 95; + } else { + theTop = $('.layout-content2.topcontent').offset().top - $(".kenjohn").position().top - $(".kenjohn").height() - 95; + } + } else { + theTop = 5; + } + // console.log(theTop); + $("html, body").animate({ + scrollTop: theTop + }, { + duration: 400, easing: "swing", complete: function () { + // console.log('finish'); + if (!stop) { + move_to_target(true); + } + } + }); + } + move_to_target(false); + return false; + }); $(window).resize(function() { if ($(window).width() <769) {