Home > Developer > JavaScript
Copy codeThe Code is as follows:
// Interesting floating. You don't need too much code to share with us.
<Html>
<Head> random floating
<Style type = "text/css">
# Divimg {
/*
Absolute positioning of images
*/
Position: absolute;
}
</Style>
</Head>
<Body>
<Div id = "divimg">
</Div>
<Script language = "javascript" type = "text/javascript">
// Obtain all div objects of an image
Var divimg = document. getElementById ("divimg ");
// Set the start position
Var x = 0, y = 0;
// Set the forward speed of the image
Var xSpeed = 8, ySpeed = 2;
// Set the floating height and width of the image
Var w=document.doc umentElement. clientWidth-205, h = document. body. clientHeight-108;
// Alert (w );
Function floatimg (){
// Compare whether the border is reached. If the border is reached, the direction of the image is reversed. If the border is not reached, move forward.
If (x <0 | x> w) xSpeed =-xSpeed;
If (y <0 | y> h) ySpeed =-ySpeed;
X + = xSpeed;
Y + = ySpeed;
SetTimeout ("floatimg ()", 1000 );
Var n = divimg. style. top = Math. round (Math. random () * h) + "px ";
Var m = divimg. style. left = Math. round (Math. random () * w) + "px ";
}
Floatimg ();
</Script>
</Body>
</Html>
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
