将jQuery嵌套在Javascript函数中，以便从Display:None淡入Div

我有一个基于他们的ID显示div的解决方案，但我希望它淡入

由于页面的复杂性以及它位于WordPress内部的事实，我想修改这个DOM函数，使其包含一个.showslow，以使淡入工作，而不是重新设计整个页面

代码如下：

CSS块

<style>
.biobox { display:none;}
</style>

我想将jQuery插入FadeIn的JavaScript var divs=[1,2]； var visibleDivId=null

function toggleVisibility(divId) {
    if(visibleDivId === divId) {
        visibleDivId = null;
    } else {
        visibleDivId = divId;
    }

    hideNonVisibleDivs();
}

function hideNonVisibleDivs() {
var i, divId, div;

for(i = 0; i < divs.length; i++) {
    divId = divs[i];
    div = document.getElementById(divId);

    if(visibleDivId === divId) {

        div.style.display = "block"; 
        //the above line I want to swap with a jquery instance that includes .show("slow"), such as this code that does not work for me $(document).ready(function(){ $(div).show("slow"); });

    } else {
        div.style.display = "none";
    }
  }
}
</script>

默认情况下隐藏的DIV

<div class="biobox" id="one">
<img src="http://deliveringhappiness.com/wp-content/uploads/2013/08/thought-leadership1.jpg" width="346" height="346" border="0" />
</div>
<div class="biobox" id="two">
<img src="http://www.traianbadulescu.ro/wp-content/uploads/2012/10/leaders.jpg" width="402" height="317" />
</div>

切换biobox的DIV可见性的代码

    <a href="#" onclick="toggleVisibility('one');">Close</a>
    <a href="#" onclick="toggleVisibility('two');">Close</a>

---

那么为什么$document.readyfunction{$div.showslow；}；无法替代div.style.display=block；？顺便说一句，我在这段代码之前将jQuery插入页面。

您需要一种不同的方式隐藏不可见的div，因为您不能从显示中淡出：从none到另一个显示值，可以是block、inline或inline block

---

您可以转换不透明度，或者结合不透明度、z索引或左/右屏幕外隐藏进行操作

是的，我知道我可以通过两个类来实现，一个是显示类：none，另一个是不透明类，使用jQuery的淡入命令，但我发现的代码都是用jQuery编写的，我不知道如何将其与非jQuery代码集成，但我明天会发布它。感谢您确认您不能从显示中淡出：无。这就为许多可能的解决方案铺平了道路；剩下的你可以或者应该在CSS中完成。