/**
* Created by zhousg on 2015/12/18.
*/
window.onload = function(){
search();
};
/*頭部搜索*/
var search = function(){
/*搜索框對象*/
var search = document.getElementsByClassName('jd_header_box')[0];
/*banner對象*/
var banner = document.getElementsByClassName('jd_banner')[0];
/*高度*/
var height = banner.offsetHeight;
window.onscroll = function(){
var top = document.body.scrollTop;
/*當滾動高度大於banner的高度時候顏色不變*/
if(top > height){
search.style.background = "rgba(201,21,35,0.85)";
}else{
var op = top/height * 0.85;
search.style.background = "rgba(201,21,35,"+op+")";
}
};
};
手機站頂部效果,漸變背景色
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.