Tema: ancla con JS
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 22/08/2010, 19:15
MadDunDee
 
Fecha de Ingreso: octubre-2006
Mensajes: 199
Antigüedad: 17 años, 6 meses
Puntos: 3
ancla con JS

Muy buenas!

estoy trabajando un menu tipo "tab" donde una vez se pulsa sobre uno de los tabs aparece un contenido u otro. El código es el siguiente:

Código PHP:
<div id="wdgt-thread" class="tabbed-wdgt">
                    <
div class="tabbed-area">
                        <
ul class="tabs">
                            <
li><a href="#wdgt-thread" id="tab-thread-1" class="tab-thread tab-active active" title="thread-1">popular news</a></li>
                            <
li><a href="#wdgt-thread" id="tab-thread-2" class="tab-thread tab-active" title="thread-2">last comments</a></li>
                        </
ul>
                        <
div id="thread-1" class="tab-content">
                            <
ul>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number one &nbsp;&nbsp;<small>12 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number two &nbsp;&nbsp;<small>2 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number three &nbsp;&nbsp;<small>0 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number four &nbsp;&nbsp;<small>1 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number five &nbsp;&nbsp;<small>56 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number six &nbsp;&nbsp;<small>15 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number seven &nbsp;&nbsp;<small>22 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number eight &nbsp;&nbsp;<small>18 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number nine &nbsp;&nbsp;<small>25 comments</small></a></li>
                                <
li><a href="#" title="SEO KEYWORDS">News exemple number ten &nbsp;&nbsp;<small>30 comments</small></a></li>
                            </
ul>
                        </
div>
                        <
div id="thread-2" class="tab-content">
                            <
ul>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                                <
li><a href="#" title="SEO KEYWORDS">Comment in the blog section</a></li>
                            </
ul>
                        </
div>
                    </
div><!--end div.tabbed-area-->
                </
div><!--end div#wdgt-thread--> 
Y lo controlo con jQuery desde un archivo externo a través del sigueinte evento:

Código PHP:
$("a.tab-thread").click(function () {

            $(
".active").removeClass("active");
            $(
this).addClass("active");

            $(
"div#wdgt-thread div.tab-content").slideUp();

            var 
content_show = $(this).attr("title");
            $(
"#"+content_show).slideDown();

        }); 
Pues bien, el caso es q funciona correctamente y como esperaba. Pero el problema es que cuando pulso el ancla (etiqueta "a") que lanza dicho evento en .click me salta al principio del documento, lo cual no entiendo.

Espero q alguien me pueda ayudar con esto, muchas gracias!!


Última edición por MadDunDee; 22/08/2010 a las 19:24