<!DOCTYPE html><html><head> <title></title></head><style type="text/css"> html,body,div{ padding: 0; margin: 0; } .heads{ width: 100%; height: 60px; background-color: white; position: fixed; } .bigbox img{ width: 100%; top: 0px; } .img1{ width: 100% top:0px; height: 1500px; overflow: hidden; position: absolute; position: relative; left: 100px; top: 100px; /*transition: all all 1.5s cubic-bezier(0.25, 0.1, 0.71, 1.26) 0s;*/ opacity: 0.5; } .img1 img{ /*position: absolute; height: 0px; width: 100%;*/ } .v{ height: 550px; width: 100%; background-color: white; position: absolute; top: 1200px; } .x{ height: 550px; width: 100%; background-color: white; position: absolute; top: 2700px; }</style><body><div class="heads"></div><div class="bigbox"> <div class="img1"> <img src="C:\Users\unyu\Desktop\text\img\water_3840.jpg"> </div> <!-- <div class="img2"> <img src="C:\Users\unyu\Desktop\text\img\rain_3840.jpg"> </div> --> <div class="v"> <div class="text1"></div> </div> <div class="x"> <div class="text2"></div> </div></div><script>//let img1 = document.getElementById('img1');window.onload = function() { //img1.style.top=1000 + "px";document.getElementById(img1).style.opacity=1;}</script></body></html>
我想做一個網(wǎng)頁效果，就是刷新頁面圖片透明度慢慢改變
sunsay
2018-10-16 20:25:57
