使用jQuery（也许是CSS），我该如何隐藏一个没有折叠和动画的元素？

以下是所期望的跨度，这将被隐藏使用jQuery（也许是CSS），我该如何隐藏一个没有折叠和动画的元素？

<span class="lastSave" name="lastSave">Last Saved by <i name="lastSavedBy"></i> at <i name="lastSaved"></i> </span>

有一个见下表此页面。

以下是某些事件调用的javascript中的相关函数。请注意，这个使桌子向上移动。

function hideLastSaved(form){ 
    jQuery(' [name="lastSave"]').hide(); 
} 

function showLastSaved(form){ 
    jQuery(' [name="lastSave"]').show(); 
}

在javascript中取代上面的代码片段，我尝试了以下内容。这不会使桌子向上移动。但是这个有一些淡出，这在我的应用程序中是不希望的。

function hideLastSaved(form){ 
    jQuery(' [name="lastSave"]').animate({opacity:0}); 
} 

function showLastSaved(form){ 
    jQuery(' [name="lastSave"]').animate({opacity:100}); 
}

来源

2011-08-19 angela

您是否试图让它消失，但不移动任何周围的元素？你想用动画还是不用？这不是很清楚...... – Nayish

线索是在名称中。动画（），它动画。你可以尝试使用css（）而不是动画。我建议使用可见性，如果要以相同的方式隔开所有内容，则视情况设置为“隐藏”或“可见”。 – daveyfaherty

隐藏方法改变了元件的至none的display属性。

如果要在隐藏元素的同时保留元素的位置，请添加一个将visibility设置为hidden的类。

CSS：

.hider{ 
    visibility:hidden; 
}

function hideLastSaved(form){ 
    $(' [name="lastSave"]').addClass('hider'); 
} 

function showLastSaved(form){ 
    $(' [name="lastSave"]').removeClass('hider'); 
}

这里是一个非常基本的演示：http://jsfiddle.net/dWw7F/

来源

2011-08-19 10:42:04

尝试changinging的CSS可见属性。

来源

2011-08-19 10:43:06 Sleeperson

function hideLastSaved(){ 
    jQuery(' [name="lastSave"]').css('opacity','0'); 
} 

function showLastSaved(){ 
    jQuery(' [name="lastSave"]').css('opacity','1'); 
}

来源

2011-08-19 10:47:31 Nightw0rk

不透明度为0.0和1.0，而不是0和100 ... – 2011-08-19 10:49:20

错误=）复制粘贴 – Nightw0rk

我的错误之间，该任择议定书没有指定他想要的元素时隐时占用任何空间，你的答案是罚款。虽然我见过IE有不透明的问题。（与其他一切） – daveyfaherty

使用下面的代码来改变span的可见性：

$('#uniqueSpanId').animate({opacity: 0.0});

这将改变跨度的透明度与uniqueSpanId 0使其不可见。改变它从背面简单反其道而行之命令：

$('#uniqueSpanId').animate({opacity: 1.0});

来源

2011-08-19 10:47:50 Nayish

的另一种方法：

function hideLastSaved(form){ 
    jQuery(' [name="lastSave"]').css('display','none'); 
} 

function showLastSaved(form){ 
    jQuery(' [name="lastSave"]').css('display','block'); 
}

jQuery hide() =设定display: none和visibility: hidden，与过渡

jQuery show() =设定display: block和visibility: visible，转型

来源

2011-08-19 10:52:29 daveyfaherty

好吧我想要一切留在原地，所以jQuery中的.hide()没有工作，因为这等同于CSS

.hide{ 
display: none 
}

还增加了下面的类，我不希望任何形式的动画所以.animate()和不断变化的不透明度从0到1不是我正在寻找的。我试过了，我可以看到这个元素淡出。我希望它在页面移动时不会立即消失。

我决定使用的CSS（propertyName的，值）

function hideLastSaved(form){ 
    jQuery(' [name="lastSave"]').css('visibility','hidden'); 
} 

function showLastSaved(form){ 
    jQuery(' [name="lastSave"]').css('visibility','visible'); 
}

其是添加类像这样的较短的方法：使用

.hider{ 
visibility: hidden 
}

到元件

function hideLastSaved(form){ 
    $(' [name="lastSave"]').addClass('hider'); 
} 

function showLastSaved(form){ 
    $(' [name="lastSave"]').removeClass('hider'); 
}

与Jamie Dixon建议的相似。

我还没有尝试过什么Nightw0rk提示：

function hideLastSaved(){ 
    jQuery(' [name="lastSave"]').css('opacity','0'); 
} 

function showLastSaved(){ 
    jQuery(' [name="lastSave"]').css('opacity','1'); 
}

，但会尝试只是让我知道它的样子。

非常感谢您的宝贵建议！

来源

2011-08-22 01:29:52 angela

如果您使用的是旧版本的jQuery然后使用以下命令：

function hideLastSaved(form){ 
jQuery(' [name="lastSave"]').fadeOut(1); 
} 

function showLastSaved(form){ 
jQuery(' [name="lastSave"]').fadeIn(1); 
}

的“1”只是设置1毫秒的时间尺度在技术上是没有，如果你使用的是较新版本JQuery然后只需添加$而不是JQuery：

function hideLastSaved(form){ 
$('[name="lastSave"]').fadeOut(1); 
} 

function showLastSaved(form){ 
$('[name="lastSave"]').fadeIn(1); 
}

来源

2014-01-09 21:04:09 user2558741

使用jQuery（也许是CSS），我该如何隐藏一个没有折叠和动画的元素？

回答

相关问题