gpt4 book ai didi

jquery 切换动画元素消失

转载 作者:太空宇宙 更新时间:2023-11-04 03:56:16 26 4
gpt4 key购买 nike

在下面得到这段代码(选择页面上的第一段,然后对其应用切换功能,它会设置高度动画(增加/减少一定量)。

问题是,一旦页面加载第一段就消失了,如果你运行它你会看到(不知何故得到一个 display:none 属性,这大概就是它消失的原因)。

有人知道为什么会这样吗?

<html>
<head>
<title></title>
<script src="jquery-1.11.0.js"></script>
<!-- <script src="jquery.color-2.1.0.js"></script> -->
<script>
$(document).ready(function(){
$('p:first').toggle(function() {
$(this).animate({'height':'+=150px'}, 2000, 'linear');
}, function() {
$(this).animate({'height':'-=150px'}, 2000, 'linear');
});
});
</script>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur, ipsa, ea, et alias architecto iste ipsum velit esse soluta rem earum magni veritatis voluptatem consequatur omnis recusandae beatae quaerat praesentium!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur, ipsa, ea, et alias architecto iste ipsum velit esse soluta rem earum magni veritatis voluptatem consequatur omnis recusandae beatae quaerat praesentium!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur, ipsa, ea, et alias architecto iste ipsum velit esse soluta rem earum magni veritatis voluptatem consequatur omnis recusandae beatae quaerat praesentium!</p>
</body>
</html>

最佳答案

您正在使用 .toggle() $('p:first') 将显示或隐藏匹配的元素。当您在 DOM 上调用 .toggle() 时,即 $(document).ready(function() 第一个 p 将被隐藏。

来自文档:

通过更改 CSS 显示属性,匹配的元素将立即显示或隐藏,没有动画。如果该元素最初显示,它将被隐藏;如果隐藏,它将被显示。显示属性会根据需要保存和恢复。如果一个元素的显示值为内联,然后隐藏和显示,它将再次内联显示。

关于jquery 切换动画元素消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22768958/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com