jquery - 如何使用 jQuery 删除元素但仍保留它存在的空间

Question

有没有办法使用 jQuery 隐藏或显示元素，但仍保留它在页面上占用的空间？例如，一组链接，每个链接下方都有一个段落。当用户将鼠标悬停在链接上时，段落将消失/出现，但布局不会随着段落的删除而改变。

score 4 · Accepted Answer

执行此操作的非常简单的方法是使用visiblityCSS 属性：

$('a').hover(function() {
    $(this).next().css('visibility', 'visible');
}, function() {
    $(this).next().css('visibility', 'hidden');
});

$(this).next()可能需要修改以找到要显示或隐藏的正确元素。

score 2 · Accepted Answer

你可以只用 CSS 来做到这一点，不需要 JavaScript。

p {
    visibility:hidden;
}
a:hover + p {
    visibility:visible;
}

score 1 · Accepted Answer

你可以用css隐藏它：

jQuery('p').css('opacity', 0);

这样，元素是不可见的，但仍会根据其尺寸填充所需的空间。这样，当您想要平滑地隐藏元素时，您也可以对其进行动画处理。

score 0 · Accepted Answer

您可以使用visibility:hidden或opacity:0

hidden 值隐藏了一个元素，但在它本来应该存在的地方留下了空间

score 0 · Accepted Answer

您可以使用内置 jquery 方法隐藏元素：

$('#ElementId').hide();

并使用以下方式显示：

$('#ElementId').show();

5 回答 5