zoukankan      html  css  js  c++  java
  • 图片跟着鼠标动js

    <!DOCTYPE html>
    <html>
    <head>
    <title>duisgf</title>
    <meta charset="utf-8">
    <style type="text/css">
    #image{
    position: relative;
    left: 0px;
    top: 0px;
    }
    </style>
    </head>
    <body>
    <div>
    <img src="flowers.jpg" id="image">
    </div>
    </body>
    </html>
    <script type="text/javascript">
    var img = document.getElementById("image");
    document.onclick = function(event){
    var event = event || window.event;
    targetX =event.clientX - img.offsetWidth/2;
    targetY = event.clientY - img.offsetHeight/2;
    }

    var leaderX=0;
    leaderY=0;
    targetX=0;
    targetY=0;
    setInterval(function(){
    leaderX = leaderX + (targetX - leaderX)/10;
    leaderY = leaderY + (targetY - leaderY)/10;

    img.style.left = leaderX+"px";
    img.style.top = leaderY + "px";
    },10)
    </script>

  • 相关阅读:
    poj 2155 B
    hdu 1556 A
    hdu 1556 A
    #366 A-C
    最长上升子序列
    Codeforces Div3 #501 A-E(2) F以后补
    字典的建立 查找
    字典序大小
    头文件模板
    01背包模板 及 优化
  • 原文地址:https://www.cnblogs.com/yzybc/p/5781448.html
Copyright © 2011-2022 走看看