Elementor Sticky and Shrinking Header 2024 Update
想要用 Elemetor 製作固定在上方的Header,同時又能在滑鼠向下滾動時縮小,
另外在縮放不同的瀏覽器螢幕大小時,也要能維持上述功能。
我們可以先參考 Elementor官方的來進行Elementor編輯器中的設定 https://elementor.com/blog/shrinking-sticky-header/
不過,該指南對2024最新版本的Elementor提到的Container概念做法,似乎沒甚麼作用。
修正js碼如下(放在CodeWP外掛):
document.addEventListener('DOMContentLoaded', function() {
var header = document.querySelector('.sticky-header');
var shrinkOn = 0;
function updateShrinkOn() {
var viewportWidth = window.innerWidth;
if (viewportWidth >= 1...