Simulator88
Simulator88

Reputation: 637

Show one div and hide others

I just made this script. When you click on a link it shows a div with the same id of the link and hide the others which class is hideable.

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;
    }

But, when I click on a link, the first div just get hide and the other get shown, and it looks really awful. How does it possible to hide without animation the other divs and show the one with animation.

I tried it with $(divid).style.display = "none"; But it won't work.

Upvotes: 0

Views: 654

Answers (1)

Kansha
Kansha

Reputation: 570

.hide() will hide without an animation

In your case:

$(divs[i]).hide();

Upvotes: 2

Related Questions