Javascript 显示/隐藏多个Div，效果较慢

我有一个小问题，老实说，我是JS的新手

在stackoverflow的好人的帮助下，我成功地做到了：

a href="JavaScript:;"onmouseover="showIt('logo1')"onmouseout="hideIt('logo1')"

img style="border:2px solid #fff;margin:-2px;" src="images/clients/1.jpg" 

onmouseover="this.src='images/clients/1a.jpg'" 

onmouseout="this.src='images/clients/1.jpg'"

其次是：

div id="logo1" style="display:none;"

JS：我在这个网站上找到的，并且它工作得很好的是：

lastone = 'empty';

function showIt(lyr) {
    if (lastone != 'empty') lastone.style.display = 'none';
    lastone = document.getElementById(lyr);
    lastone.style.display = 'block';

}

function hideIt(lyr) {
    if (lastone != 'empty') lastone.style.display = 'block';
    lastone = document.getElementById(lyr);
    lastone.style.display = 'none';
}`

我有25个这样的标志。现在一切都好了。但如何使过渡更平滑。不会出现和消失

提前谢谢你的帮助

尝试使用

.fadeIn（）

/

.fadeOut（）

来实现您想要的

function showIt(lyr) {
  $("#"+lyr).stop().fadeIn("slow");
}

function hideIt(lyr) {
  $("#"+lyr).stop().fadeOut("slow");
}

---

切换“显示”将始终显示/隐藏元素，而无需转换。有很多方法可以达到你想要的效果

您已将其标记为“jQuery”：尝试使用和

---

您还可以通过在要显示/隐藏的元素上应用/删除类来使用。

您也可以通过显示和隐藏来实现这一点，方法如下：

 lastone = 'empty';

    function showIt(lyr) {
        $('#'+lyr+'\'').show(500);
    }

    function hideIt(lyr) {
        $('#'+lyr+'\'').hide(500);
    }`

---

您可以通过以下链接进行检查

---

}))

很好，我从你的回答中学到了一些道理$（“#toggle3，#toggle4”）谢谢你这部作品很棒，但由此产生的问题是，我的隐藏对象处于相同的位置，因此即使我提高淡出速度，div仍会在短时间内起球。我可以在元素之间使用FadeTo等功能吗？非常感谢您的迅速回复

$("#toggle3, #toggle4").click(function() {
$(this).next(".toggle").slideToggle("slow");