js请教怎么处理图片

请教图片在页面里随便飘，
但当鼠标碰到图片是图片停在飘动
当鼠标拿个时图片再飘给代码

解决方案 »

  1.   

    http://ad.jz123.cn/
      

  2.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <META NAME="Generator" CONTENT="EditPlus">
    <META NAME="Author" CONTENT="">
    <META NAME="Keywords" CONTENT="">
    <META NAME="Description" CONTENT="">
    </HEAD>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
        var fishLeft = "left";
    var fishTop = "top";
        var stap = 1; function fishSwims() {
        var leftMax = document.body.offsetWidth - document.getElementById("advFish").offsetWidth; var topMax = document.body.offsetHeight - document.getElementById("advFish").offsetHeight; var curLeft = document.getElementById("advFish").style.pixelLeft;
    var curTop = document.getElementById("advFish").style.pixelTop; if(curLeft < 0) {
       fishLeft = "right";
    } else if (curLeft > leftMax) {
       fishLeft = "left";
    } if(curTop < 0) {
       fishTop ="down";
    } else if (curTop > topMax) {
               fishTop ="top";
    } if(fishLeft == "left") {
       curLeft = curLeft - stap;
    } else {
        curLeft = curLeft + stap;
    } if(fishTop == "top") {
       curTop = curTop - stap; 
    } else {
        curTop = curTop + stap; 
    }        document.getElementById("advFish").style.pixelLeft = curLeft;
            document.getElementById("advFish").style.pixelTop = curTop; setTimeout("fishSwims()",10);
    }
    //-->  
    </SCRIPT>
    <BODY onLoad="fishSwims()">
    <div id="advFish" style="position:absolute; left:16px; top:80px; z-index:1">
         <img src="images/fish.gif">
    </div>
    <img src="images/sea.jpg" width=1190px>
    </BODY>
    </HTML>
      

  3.   

    也许你有用
    本说明:
    把如下代码加入<body>区域中
    <DIV id=dot0 
    style="HEIGHT: 0px; LEFT: 0px; POSITION: absolute; TOP: 0px; VISIBILITY: hidden; WIDTH: 0px"></DIV>
    <DIV id=dot1 
    style="HEIGHT: 0px; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 0px"><IMG 
    height=30 src="java2000.gif" width=88> </DIV>
    <DIV id=dot2 
    style="HEIGHT: 0px; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 0px"><IMG 
    height=30 src="java2000.gif" width=88> </DIV>
    <SCRIPT language=JavaScript>
    <!-- 
    // define number of divs
    var nDots = 3;
    // define starting position of image
    var Xpos = 0;
    var Ypos = 0;
    // define speed of moving image
    var DELTAT = .01;
    // define how far the image drops from the cursor
    var SEGLEN = 10;
    // define how big is the loop the image makes around the cursor
    var SPRINGK = 10;
    // the greater the mass the slower the speed of image
    var MASS = 1;
    // the greater the gravity the smaller is the loop
    var GRAVITY = 50;
    // the greater the resistance the slower the speed of image
    var RESISTANCE = 10;
    var STOPVEL = 0.1;
    var STOPACC = 0.1;
    var DOTSIZE = 11;
    // define the size of the bounces of the image
    var BOUNCE = 0.75;
    var isNetscape = navigator.appName=="Netscape";
    var followmouse = true;
    var dots = new Array();
    init();
    function init()
    {
    var i = 0;
    for (i = 0; i < nDots; i++) {
    dots[i] = new dot(i);
    }
    if (!isNetscape) {
    //
    }
    for (i = 0; i < nDots; i++) {
    dots[i].obj.left = dots[i].X;
    dots[i].obj.top = dots[i].Y;
    } 
    if (isNetscape) {
    startanimate();
    } else {
    setTimeout("startanimate()", 3000);
    }
    }
    function dot(i) 
    {
    this.X = Xpos;
    this.Y = Ypos;
    this.dx = 0;
    this.dy = 0;
    if (isNetscape) {   
    this.obj = eval("document.dot" + i);
    } else {
    this.obj = eval("dot" + i + ".style");
    }
    }
    function startanimate() {       
        setInterval("animate()", 20);
    }
    function setInitPositions(dots)
    {
    var startloc = document.all.tags("LI");
    var i = 0;
    for (i = 0; i < startloc.length && i < (nDots - 1); i++) {
    dots[i+1].X = startloc[i].offsetLeft
    startloc[i].offsetParent.offsetLeft - DOTSIZE;
    dots[i+1].Y = startloc[i].offsetTop +
    startloc[i].offsetParent.offsetTop + 2*DOTSIZE;
    }
    dots[0].X = dots[1].X;
    dots[0].Y = dots[1].Y - SEGLEN;
    }
    function MoveHandler(e)
    {
    Xpos = e.pageX;
    Ypos = e.pageY;       
    return true;
    }
    function MoveHandlerIE() {
    Xpos = window.event.x + document.body.scrollLeft;
    Ypos = window.event.y + document.body.scrollTop;      
    }
    if (isNetscape) {
    document.captureEvents(Event.MOUSEMOVE);
    document.onMouseMove = MoveHandler;
    } else { document.onmousemove = MoveHandlerIE; }
    function vec(X, Y)
    {
    this.X = X;
    this.Y = Y;
    }
    function springForce(i, j, spring)
    {
    var dx = (dots[i].X - dots[j].X);
    var dy = (dots[i].Y - dots[j].Y);
    var len = Math.sqrt(dx*dx + dy*dy);
    if (len > SEGLEN) {
    var springF = SPRINGK * (len - SEGLEN);
    spring.X += (dx / len) * springF;
    spring.Y += (dy / len) * springF;
    }
    }
    function animate() {    
    var start = 0;
    if (followmouse) {
    dots[0].X = Xpos;
    dots[0].Y = Ypos;       
    start = 1;
    }
    for (i = start ; i < nDots; i++ ) {
    var spring = new vec(0, 0);
    if (i > 0) {
    springForce(i-1, i, spring);
    }
    if (i < (nDots - 1)) { 
    springForce(i+1, i, spring);
    }
    var resist = new vec(-dots[i].dx * RESISTANCE,-dots[i].dy * RESISTANCE);
    var accel = new vec((spring.X + resist.X)/ MASS,(spring.Y + resist.Y)/ MASS + GRAVITY);
       dots[i].dx += (DELTAT * accel.X);
       dots[i].dy += (DELTAT * accel.Y);
    if (Math.abs(dots[i].dx) < STOPVEL && Math.abs(dots[i].dy) < STOPVEL && 
    Math.abs(accel.X) < STOPACC && 
    Math.abs(accel.Y) < STOPACC) { 
    dots[i].dx = 0; 
    dots[i].dy = 0;
    } 
    dots[i].X += dots[i].dx;
    dots[i].Y += dots[i].dy;
    var height, width;
    if (isNetscape) {
    height = window.innerHeight + document.scrollTop;
    width = window.innerWidth + document.scrollLeft;
    } else {        
    height = document.body.clientHeight + document.body.scrollTop;
    width = document.body.clientWidth + document.body.scrollLeft;
    }
    if (dots[i].Y >=  height - DOTSIZE - 1) {
    if (dots[i].dy > 0) {
    dots[i].dy = BOUNCE * -dots[i].dy;
    }
    dots[i].Y = height - DOTSIZE - 1;
    }
    if (dots[i].X >= width - DOTSIZE) {
    if (dots[i].dx > 0) {
    dots[i].dx = BOUNCE * -dots[i].dx;
    }
    dots[i].X = width - DOTSIZE - 1;
    }
    if (dots[i].X < 0) {
    if (dots[i].dx < 0) {
    dots[i].dx = BOUNCE * -dots[i].dx;
    }
    dots[i].X = 0;
    }
    dots[i].obj.left = dots[i].X;                   
    dots[i].obj.top =  dots[i].Y;           
    }
    }
    // -->
    </SCRIPT>