Home > Developer > JavaScript
Roaming between the Web, you will find that the Internet is not only the ocean of information, but also the ocean of advertising. In addition to the ordinary GIF Banner, flash, floating advertising is the current online more popular form of advertising. When you drag the browser's scroll bar, the ad that floats on the page can be moved along with the screen. Although this effect is quite useful for advertising display, for those browsing your Web site, it is an impediment to reading and an interest in reading, so it must not be abused. However, if you can make good use of it, it can play a great role.
To make the effect of floating ads is not difficult, if you have the basis of JS can write their own, if the ligatures are too lazy to write, to download a special effects tool on the web, press the hint to paste the code on OK. However, want to really understand how it is done, you need to master some JS knowledge. Here to introduce a simple floating advertising practice.
The following code can be placed between <body></body>, during which I added some comments (i.e. "//" after text and "<!-" "-->").
<script For=window event=onload language= "JScript" >
Initad ()//load page, call function Initad ()
</SCRIPT>
<script language= "JScript" >
<!--
function Initad () {
Document.all.AdLayer.style.posTop = -200;//Set the onload event excitation after the ad layer relative to the fixed y direction position
document.all.AdLayer.style.visibility = ' visible '//Set layer to visible
Movelayer (' Adlayer ');//Call Function Movelayer ()
}
function Movelayer (layername) {
var x = 600;//Floating ad layer fixed to the position of the browser in the x direction
var y = 300;//floating ad layer fixed to the Y-direction position of the browser
var diff = (document.body.scrollTop + y-document.all.adlayer.style.postop) *.40;
var y = document.body.scrollTop + Y-diff;
Eval ("document.all." + LayerName + ". Style.postop = y");
Eval ("document.all." + LayerName + ". Style.posleft = x");/mobile AD layer
SetTimeout ("Movelayer (' Adlayer ');", 20);//Set 20 milliseconds before calling function Movelayer ()
}
-->
</script>
<!--below is a layer with an ID of adlayer (for example, the ID name is not adlayer and the Adlayer in Movelayer () above should be modified accordingly), including a linked picture-->
<div id=adlayer style= ' Position:absolute; width:61px; height:59px; z-index:20; Visibility:hidden;; left:600px; top:300px ' >
<a ></a>
</div>
Here, you can set the value of x and Y to set the position of the fixed layer, and change the settimeout ("Movelayer (' Adlayer ');", 20) to the time interval that you want to invoke Movelayer (). It is also important to note that the best picture is a GIF with a transparent background, so that the background color of the picture does not cover the content behind it.
Remember, be cautious with floating ads, consider the use of special effects at the same time, must take into account the viewer's feelings, can not abuse Oh!
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
