2016-08-03 2 views
0

J'ai this website, et il y a un conflit entre Smoothscroll javascript et lightbox un.Conflit SmoothScoll et lightbox

Voici le script pour le défilement

$(function() { 
    $('a[href*="#"]:not([href="#"])').click(function() { 
     if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if (target.length) { 
      $('html, body').animate({ 
      scrollTop: target.offset().top 
      }, 1000); 
      return false; 
     } 
     } 
    }); 
    }); 

Comment puis-je résoudre? Comment puis-je faire fonctionner la visionneuse et le défilement lisse simultanément?

+0

Où est le trigger de la visionneuse sur votre page? Et à quel moment avez-vous ce conflit? –

+0

Chaque fois que je clique sur les quatre images dans la section "Personnages", la lightbox ne marche plus, une fois que j'ai ajouté le code pour le Smoothscroll –

Répondre

0

Je ne suis pas un expert jQuery et ne savent pas comment les sélecteurs sont flexibles, mais voici quelques suggestions:

Suggestion 1:

Je ne pense pas que ce sélecteur:

a[href*="#"]:not([href="#"]) 

fonctionnera correctement. Vous sélectionnez tous les éléments href s'ils ne possèdent pas la valeur d'attribut "#". Je pense que ce cas ne couvre pas les liens avec une valeur différente comme vous avez: "# queen-bee". Je considère que vous utilisez un sélecteur différent.

Suggestion 2:

if (target.length) { 
    $('html, body').animate({ 
     scrollTop: target.offset().top 
    }, 1000); 

    return false; // Try removing the return 
} 

La déclaration de retour pourrait empêcher l'événement de bouillonnement, de sorte que la lightbox recevra pas. Essayez de l'enlever.

+0

Merci beaucoup! La deuxième solution a bien fonctionné! –

+0

Il montre en fait un problème, voici le lien: http://niclamarino.altervista.org/Layouts/Beeline/5.html#about Chaque fois que vous cliquez sur les liens Menu vous avez comme un écran de 0,5 secondes de la section. Cela se produit en supprimant le "retour faux", avez-vous une idée de comment puis-je résoudre ce problème? –

+0

C'est parce que sans l'instruction return, vous revenez au comportement natif d'un href. Cela utilisera l'ancre pour sauter à la section avec l'id défini dans le href. Vous pouvez donc modifier l'identifiant de la section afin qu'elle ne trouve aucun contenu auquel accéder ou que vous récupériez l'instruction de retour et que vous utilisiez une balise et un sélecteur différents pour les boutons de menu. –