javascript - 用动画显示隐藏的 div

Question

我制作了这个脚本，它打开一个带有正确类的 div 并关闭其他的。

function showhide(id) {
    if (document.getElementById) {
        var divid = document.getElementById(id);
        var divs = document.getElementsByClassName("hideable");
        for (var i = 0; i < divs.length; i = i + 1) {
            divs[i].style.display = "none";
        }
        divid.style.display = "block";
    }
    return false;
}

是否可以制作一些动画，如淡出、缓出而不是仅通过显示选项显示？

Answer 1

你可以试试这个

function showhide(id) {
  if (document.getElementById) {
    var divid = document.getElementById(id);
    var divs = document.getElementsByClassName("hideable");
    for (var i = 0; i < divs.length; i = i + 1) {
      $(divs[i]).fadeOut("slow");
    }
    $(divid).fadeIn("slow");
  }
  return false;
}

看看这个 fiddle “http://jsfiddle.net/9jtd3/”

Jquery 库提供了更多技术，您也应该看看。