How to make simple web advertising special effects
Today, I will talk to you about how to make simple web advertising effects. Many people may not know much about it. In order to let you know more, Xiaobian summarized the following contents for you. I hope you can gain something according to this article.
In order to practice javascript, I made a simple demo, which realized that the ad slowly pulled out from the top to the maximum, then stayed for 2s, and then contracted to a smaller and closable ad effect. The picture can be replaced with any other picture.
code is as follows
#ad{ width:962px; display:none; margin:0 auto; overflow:hidden; position:relative; } #main{ margin:0 auto; width:960px; height:1700px; } #close{ width:20px; height:20px; position:absolute; top:0; right:0; font-size:16px; line-height:20px; text-align:center; display:none; background:yellowgreen; }
x
var oImgAd=document.getElementById('imgAd'); var oad=document.getElementById('ad'); var ocur=document.getElementById('curAd'); var closeBtn=document.getElementById('close'); var h=0; var maxH=oImgAd.height; var minH=ocur.height; function down() { if(hminH){ h-=5; oad.style.height=h+"px"; setTimeout(up,5); } else{ oImgAd.style.display='none'; closeBtn.style.display ='block '; } } closeBtn.onclick=function(){ oad.style.display ='none'; } setTimeout(down,1000); After reading the above, do you have any further understanding of how to make simple web advertising effects? If you still want to know more knowledge or related content, please pay attention to the industry information channel, thank you for your support.