0

如何缓慢移动 DOM 元素？这不起作用

 for ( var a = 0 ; a < 100 ; a++){

    $('*').each(function(){

      if ( ! /HTML/.test($(this).context.nodeName))
      {
        var top =  parseInt($(this).css('top')) + 1;

        $(this).css('top',top + "px");
      }

    });
  }

循环结束时定位元素

我怎样才能慢慢做到这一点？

对不起我的英语不好

4

3 回答 3

1

试试 jquery 的$.animate()

它要求您设置要移动到的目标位置，而不是连续移动

或使用setInterval：

intervalInMilliseconds=17;//60 frames per second
var interval = setInterval(function()
{
for ( var a = 0 ; a < 100 ; a++){

    $('*').each(function(){

      if ( ! /HTML/.test($(this).context.nodeName))
      {
        var top =  parseInt($(this).css('top')) + 1;

        $(this).css('top',top + "px");
      }

    });
  }
},intervalInMilliseconds);

完成后停止执行此操作：

clearInterval(interval)
于 2012-08-25T23:11:21.857 回答
1

或者在纯 JavaScript 中，您应该使用计时器

var $elem = $(this), // jquery object
    elem = $elem[0], // dom element
    currentPos = $elem.offset().top, // current position
    targetPos = currentPosition + 100, // target position
    timer = setInterval (function () { // timer to move element slowly
        currentPos++;
        $elem.css('top',currentPosition + "px");
        if (currentPos == targetPos)
            clearInterval(timer);
    }, 100);
于 2012-08-25T23:28:29.130 回答
0

如果您的目标是足够新的浏览器版本，则可以改用CSS 动画。

于 2012-08-25T23:33:59.243 回答