在加载事件的网页上自动移动Div。鼠标悬停时需要阻止这种移动......?

时间:2012-09-20 09:42:14

标签: javascript jquery html5

如何在javascript中使用div事件在网页周围移动onload。并且在调用mouse over事件时需要停止此移动吗?

<script type="text/javascript">
  var wid=1002;

  var rmax = wid2;
  var tmr  = 10;

  var intg = 2;
  var dir  = 2;

  function moveIt() {
    obj = document.getElementById("d1").style;
    curr = parseInt(obj.left);
    if (curr > rmax) {
      dir = -dir;
    }
    obj.left = curr + dir + "px";
    if ((curr == 0) && (dir < 0)) {
      dir = -dir;
    }
    timer=setTimeout("moveIt()", intg*tmr);
  }

  function init() 
  {
    setTimeout("moveIt()", intg*tmr);
  }

  function stoper() {
    clearTimeout(timer);
  }

  function hideDiv() {
   $(".floatMainContainer").hide();
   $(".floatThankyouContainer").show();
  }
</script>
<body onLoad="init()">
  <div id="d1" style="border:px solid black; top: 2%; left: 0px; z-index:999999; position:absolute; width:262px; height:6px; background-color:none;" onMouseOver="stoper()"   onmouseout="moveIt(),10000" >
    <div class="floatMainContainer"  >
      <span class="close">
        <span>Close</span>
      </span>
    </div>
  </div>
</body>
</html>   

1 个答案:

答案 0 :(得分:1)

当你用jquery标记这篇文章时,我想你会使用它。

jQuery中的On load事件如下所示:

$(function(){ <!-- here you can start moving around your div's as crazy -->   });

要阻止它们移动(假设您使用jQuery动画来移动它们),请转到:

$(yourDivsClass).mouseover(function(){ $(this).stop(); }