Evite el parpadeo en las pestañas jQuery de carga/personalizadas

Estoy usando algo de jQuery para hacer pestañas en una página. Mi problema es que si tiene una conexión algo mala, las áreas que están ocultas por el script parpadean y se muestran antes de ocultarse.

Si alguien pudiera ayudarme a modificar este script para evitar esto se lo agradecería mucho, queda así:

jQuery(document).ready(function($){

$('ul.tabs').each(function(){
// For each set of tabs, we want to keep track of
// which tab is active and it's associated content
var $active, $content, $links = $(this).find('a');

// Use the first link as the initial active tab
$active = $links.first().addClass('active');
$content = $($active.attr('href'));

// Hide the remaining content
$links.not(':first').each(function () {
    $($(this).attr('href')).hide();
});

  // Bind the click event handler
  $(this).on('click', 'a', function(e){
    // Make the old tab inactive.
    $active.removeClass('active');
    $content.hide();

    // Update the variables with the new link and content
    $active = $(this);
    $content = $($(this).attr('href'));

    // Make the tab active.
    $active.addClass('active');
    $content.show();

    // Prevent the anchor's default click action
    e.preventDefault();
});
});
});

preguntado el 22 de mayo de 12 a las 08:05

por qué no usas display:none; propiedad de css? luego mostrar/ocultar los elementos usando jQ. -

No me siento cómodo con jQuery. ¿Quieres decir, establecer la visualización inicial en mi css en ninguno, y luego el dom se ha cargado, establecerlo en normal? Entonces, ¿dejar que este script haga lo suyo? -

1 Respuestas

.ul.tabs {display:none}

Y muéstralo listo

jQuery(document).ready(function($){ $('ul.tabs').show()}

contestado el 22 de mayo de 12 a las 08:05

ul.tabs son la lista/menú para mostrar/ocultar las áreas con pestañas. Agregué una clase de "pestañas" a mis áreas con pestañas, y usé su código en esas en su lugar y funcionó. ¡Así que gracias! - johan dahl

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.