您现在的位置:首页 >> 前端 >> 内容

跟随鼠标移动的图片效果代码实现

时间:2018/4/14 10:09:32 点击:

  核心提示:跟随鼠标移动的图片效果代码实现p id=pic style=position:absolute;跟随鼠标移动的图片img src=https://ss1.bdstatic.com/70cFuXSh_Q...

跟随鼠标移动的图片效果代码实现

    <p id="pic" style="position:absolute;">
        跟随鼠标移动的图片
        <img src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=4239114448,637973453&fm=27&gp=0.jpg">
    </p>

<script>
function move(event) {
  var p = document.getElementById("pic");
  var x = event.clientX;
  var y = event.clientY;
  p.style.left = x + "px";
  p.style.top = y + "px";
}
document.onmousemove = move;
</script>

作者:网络 来源:陌路繁华,各安天涯