javascript - 覆盖 CSS：使用 jquery 显示无属性

Question

对于在 css 中定义为 display:none 的元素，我正在尝试运行一个函数，该函数尝试使用 .show() 显示该元素，代码如下：

CSS

.element {
  position: absolute;
  display: none;
  left: 0;
  top: 0;
}

HTML

<div class="element">Some content here</div>
<div class="element">Some content here</div>

jQuery

var c = $('.element');

c.each(function () {
  c.css({
    'left': dleft + 'px'
  });

  c.css({
    'top': dtop + 'px'
  });

  c.setTimeout(function () {
    c.show(1000);
  }, sduration);

所有变量都被填充我已经通过警告所有变量进行检查并给它们默认值，但不知何故在超时后元素没有显示。

Answer 1

setTimeout是一个全局函数。

var c = $('.element');

c.each(function () {
  c.css({ 'left': dleft + 'px', 'top': dtop + 'px' });

  setTimeout(function () {
    c.show(1000);
  }, sduration);
});

演示：http: //jsfiddle.net/S7nw3/

Answer 2

您编写的代码似乎存在两个问题。你还没有关闭 .each() 循环.. setTimeout 也是一个全局函数.. .. 检查这个

    var dleft = 40;
var dtop = 40;
var sduration = 1000;
var c = $('.element');

c.each(function() {
    c.css({
        'left': dleft + 'px',
        'top': dtop + 'px'
    });
});
setTimeout(function() {
    c.show(1000);
}, sduration);​

检查这个小提琴

Answer 3

如果你需要延迟元素的显示，你也可以使用 jQuery.delay()函数。

c.each(function() {
    c.css({
        'left': dleft + 'px',
        'top': dtop + 'px'
    });
});

c.delay(1000).show();