浏览器的滚动条滚动时，导航条的背景变色
生活随笔
收集整理的這篇文章主要介紹了
浏览器的滚动条滚动时，导航条的背景变色
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
瀏覽器的滾動條滾動時，導(dǎo)航條的背景變色
window.onscroll = function() {var headerMain = document.getElementById('headerMain');if(window.pageYOffset >= 70){headerMain.classList.add('headerMain-bg');} else {headerMain.classList.remove('headerMain-bg');} }在vue中：
mounted() {this.$nextTick(()=>{window.onscroll = function() {var headerMain = document.getElementById('header-main');if(window.pageYOffset >= 70){headerMain.classList.add('headerMain-bg');} else {headerMain.classList.remove('headerMain-bg');}}})}然后在css中寫樣式：
.header-main.headerMain-bg{background: #fff;color: #333;a{color: inherit;} } .header-main{position: fixed;right: 0;top: 0;width: 100%;max-width: 1320px;height: 4.375em;margin: auto 0;padding: 0 2.4em;box-sizing: border-box; }總結(jié)
以上是生活随笔為你收集整理的浏览器的滚动条滚动时，导航条的背景变色的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Telephony理解
- 下一篇： 最最详细的黑马前端HTML5+CSS3笔