我正在尝试为生物页面创建类似于幻灯片的内容。我想将带有 ID(“爱好”、“家”和“欢迎”)的 div 存储在一个数组中,这样我就可以单击它们,并使它们一个接一个地消失,而不是一次全部消失。正如下面的代码所示,我创建了一个名为 arr 的数组,然后在一个单独的函数中使用了一个循环来使 div 元素淡出。非常感谢这位初学者编码员的任何帮助。
<body>
<div class="aboutpage">
<img src="http://www.2020site.org/trees/images/MatureWalnut.jpg">
<div id="slideshow">
<div id="homeplace">
<img src="http://www.2020site.org/trees/images/MatureWalnut.jpg">
</div>
<div id="hobbies" >
<img src="http://www.allaboutbirds.org/guide/PHOTO/LARGE/red_winged_blackbird_glamour.jpg">
</div>
<div id="welcome">
<h1>What's up!</h1>
</div>
</div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$var arr=[];
$("#slideshow div").each(function(){ arr.push($(this));});
}
)
$("#slideshow").click(function(){
for (i=0; i<arr.length; i++){
$arr[i].fadeOut();
}
});
</script>
最佳答案
这具有不透明度
和滑动
效果:
$("#slideshow div").click(function() {
$(this).animate({"opacity": "0"}, 400, function() {
$(this).animate({"height": "toggle"}, 400);
});
})
关于javascript - 如何使用 jQuery 将 div 添加到数组,然后使用循环和 fadeOut 方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34714811/