Slick Curseur slickGoTo méthode de briser le carrousel
Je suis en train de travailler sur une nouvelle page de l'article qui dispose également d'une galerie d'images.
Je suis en utilisant la nappe de curseur pour les vignettes de la galerie. Chaque image dans la galerie dispose de sa propre url de l'annonce de la vue (pas très agréable, mais je ne peux rien faire à ce sujet) comme our-url.com/category/articlewithgallery/1, 2 ou 3, etc...
Je suis en responsive points d'arrêt comme ceci:
$('.gallery-thumbs').slick({
slidesToShow: 5, slidesToScroll: 5, dots: false, infinite: false, speed: 300,
responsive: [ { breakpoint: 1024, settings: { slidesToShow: 5, slidesToScroll: 5 } },
{ breakpoint: 600, settings: { slidesToShow: 4, slidesToScroll: 4 } },
{ breakpoint: 438, settings: { slidesToShow: 3, slidesToScroll: 3 } },
{ breakpoint: 270, settings: { slidesToShow: 2, slidesToScroll: 2 } } ]
} );
et cela fonctionne bien. Mais parce que nous avons beaucoup d'url, j'aimerais les vignettes pour démarrer dans le courant de l'image chargée. Je peux faire cela en ajoutant ceci:
$('.gallery-thumbs').slickGoTo(parseInt(cur_pic));
Les vignettes de démarrage à la position correcte, mais il casse le carrousel. Par exemple je ne peux pas faire défiler vers l'arrière plus. Je peux faire glisser et de voir qu'il y a plus de vignettes dans cette direction mais il rebondit dans le (nouveau) position de départ. Aussi, si nous sommes sur la dernière "diapositives", soit il ne les indique pas du tout, ou ajoute de l'espace vide après toutes les vignettes.
J'ai pensé que peut-être c'est parce que je n'utilise pas la nappe curseurs "onInit" fonction et il mess it up parce que nous le disons d'aller à la diapositive avant de l'initialisation ou de quelque chose. J'ai essayé toutes sortes de choses, et ne pouvait pas faire onInit: function() des choses à travailler.
Peut être parce que je suis assez mauvais en javascript.
jsfiddle.net/9fnmegqb/389. Pouvez-vous m'aider sur ce point.Dernier élément est manquant,
Désolé, changé projets depuis cette et de ne pas y aller avec de la nappe de plus. Mais oui je n'ai jamais réussi à le faire fonctionner, de toute façon si juste fini par abandonner les vignettes...
OriginalL'auteur jimihenrik | 2014-07-22
Vous devez vous connecter pour publier un commentaire.
Son travail.
code:
$('.firstDiv').slickGoTo(4)
;Veuillez voir exemple ci-dessous
http://jsfiddle.net/9fnmegqb/
Et à partir de la version 1.4+ :
$('.firstDiv').slick('slickGoTo', 4)
Pouvez-vous vérifier ce lien . Je crois que j'ai répondu jsfiddle.net/9fnmegqb/6
Petite note: à partir de la version 1.4, les méthodes à invoquer des actions ont changé. L'équivalent de la ligne de code pour que cette réponse est de 1,4 woud être:
$('.firstDiv').slick('slickGoTo', 4)
Vous devriez faire une réponse de Simon. Je m'a pris 30 minutes pour trouver vos commentaires, et je crois que c'est la bonne réponse. Je sais que c'est dans leur documentation (maintenant que je le sais, je le vois bien évidemment) mais j'ai clairement été de se précipiter à travers elle et manqués, comme beaucoup de développeurs sera, je crois, malheureusement
Au moment de la question, cette réponse est valable. Je vois qu'il a été édité donc, je suis dubitatif à propos de faire une réponse, mais comme vous avez dit longtemps après l'édition, il a probablement fait sens pour y répondre.
OriginalL'auteur Praveen G
Partir de la version 1.4, les méthodes à invoquer des actions ont changé.
L'équivalent de la ligne de code pour la
slickGoTo()
fonction est$('#slider_selector_id').slick('slickGoTo', slide_number);
(où
#slick_selector_id
est l'id du curseur, etslide_number
est un entier de l'index de diapositive requis)(réponse de commentaire comme suggéré par Alexandre Bourlier en réponse à la une autre réponse ici)
OriginalL'auteur Simon Shirley
La solution que j'ai trouvé est de les faire modifier à l'infini de vrai
Je sais que le poste est de 3 ans, mais j'ai dû poster une solution de rechange.
OriginalL'auteur gmetax