一个简单的JS模拟屏保效果

最新推荐文章于 2023-02-04 09:23:53 发布

weixin_30559481

最新推荐文章于 2023-02-04 09:23:53 发布

阅读量265

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/green-4984/archive/2011/12/18/2291723.html

版权

　　最近两天较为系统复习了下js和dom，感觉各种属性好多，还是要靠手册来活着，要不还是记不住，脑袋不行了......

　　一个小东东聊以自娱，还是蛮不错的。

　　这里是html页面

<html>
<head>
<script type="text/javascript" src="js.js">
</script>
</head>
<body>
<input type="button" value="createWindow!" onclick="createSmallWindow()"/>
<p/>
<input type="button" value="moveTheWindow!" onclick="moveTheWindow()"/>
<input type="button" value="speedUp" onclick="speedUp()"/>
<input type="button" value="speedDown" onclick="speedDown()"/>
<p/>
<input type="button" value="destroyWindow" onclick="destroyWindow()" />
<div id="divShow"></div>
</body>
</html>

　　这个是js

/*
 *    global variable
*/
var myWindow;
var timer;
var speed=10;
var screenX;
var screenY;
var windowX=200;
var windowY=200;
//the window can move 0~X,0~Y
var spanX;
var spanY;
//the window location now!
var X;
var Y;
//direction 1 or -1
var directionX;
var directionY;

//create small window for test
function createSmallWindow(){
if(myWindow==undefined)
    {
        myWindow=window.open('','','height='+windowY+',width='+windowX);
        myWindow.document.write("The window is created for test only!");
        getTheScreenWidthAndHeight();
        getTheInitDirection();
    }
}
function getTheScreenWidthAndHeight(){
    screenX=screen.width;
    screenY=screen.height;
    spanX=screenX-windowX-70;
    spanY=screenY-windowY-40;
    X=parseInt(Math.random()*screenX);
    Y=parseInt(Math.random()*screenY);
    myWindow.moveTo(X,Y);
}
function getTheInitDirection(){
var num=parseInt(Math.random()*10);
if(num%2==0)
    {
        directionX=1;
    }
else
    {
        directionX=-1;
    }
    num=parseInt(Math.random()*10);
if(num%2==0)
    {
        directionY=1;
    }
else
    {
        directionY=-1;
    }
}
function moveTheWindow(){
if(timer!=undefined)
return;
//timer=setInterval("myWindow.moveBy(1,1);",speed);
    timer=setInterval("moveIt()",speed);
}
function stopTimer(){
    clearTimeout(timer);
    timer=undefined;
}
function destroyWindow(){
    stopTimer();
    myWindow.close();
    myWindow=undefined;
}
function speedUp(){
//speed=parseInt(speed/2);
    //timer=setInterval("myWindow.moveBy(1,1);",speed);
    directionX*=2;
    directionY*=2;
}
function speedDown(){
    directionX/=2;
    directionY/=2;
}
//move the window function between the max X and Y
function moveIt(){
if(0<X && X<spanX){
        X+=directionX;
    }
else{
        directionX=directionX*(-1);
        X+=directionX;
    }
if(0<Y&&Y<spanY){
        Y+=directionY;
    }
else{
        directionY=directionY*(-1);
        Y+=directionY;
    }
    myWindow.moveTo(X,Y);
}