Question

the following code that i referenced form the internet, but it doesn’t work. why?

jquery code:

 $(document).ready(function(){

        $(".tab:not(:first)").hide();
        $(".tab:first").show();

        $(".htabs a").click(function(){

         var stringref = $(this).attr("href").split("#")[1];

          $(".tab:not(#"+ stringref +')').hide();

          //fix 
          if(jQuery.browser.msie && jQuery.browser.version.substr(0,3)=="6.0"){

            $('.tab #'+stringref).show();
          }else{
            $("tab #"+stringref).fadeIn();
                return false;
          }
        });

html code:

<ul class="htabs hide">
        <li><h2><a href="#design">Graphic design</a></h2></li>
        <li><h2><a href="#development">Development</a></h2></li>
        <li><h2><a href="#freebies">Freebies</a></h2></li>
    </ul>
    <div class="tabs">
        <div id="design" class="tab">
            <ul>
                <li><a href="#">TYpography</a></li>
                <li><a href="#">TYpoface</a></li>
                <li><a href="#">painting</a></li>
                <li><a href="#">Optical balance</a></li>
            </ul>           
        </div>


        <div id="development" class="tab">
            <ul>
                <li><a href="#">TYpography</a></li>
                <li><a href="#">TYpoface</a></li>
                <li><a href="#">painting</a></li>
                <li><a href="#">Optical balance</a></li>
            </ul>           
        </div>


        <div id="freebies" class="tab">
            <ul>
                <li><a href="#">TYpography</a></li>
                <li><a href="#">TYpoface</a></li>
                <li><a href="#">painting</a></li>
                <li><a href="#">Optical balance</a></li>
            </ul>           
        </div>



    </div>


$(this).attr("href").split("#")[1];  what't the meaning of this line? why it's one( [1])?

Answer 1

The error is on these two lines:

$('.tab #'+stringref).show();

and

$(".tab #"+stringref).fadeIn();

The .tab should be removed from both, so you have:

$('#'+stringref).show();

and

$("#"+stringref).fadeIn();