J'utilise le plug-in à cycle d'utilisation dans un rotateur de nouvelles. Cela signifie que j'utilise DIV pour rensepuler les diapositives au lieu d'images.
Mon objectif ultime est de faire un pager où au lieu des 1, 2, 3, 4, etc. habituels retourne la première étiquette H3 dans la glissière.
Je sais que cela est probablement un problème de sélection mineur, mais voici ce que j'utilise jusqu'à présent: J'ai aussi essayé quelque chose comme ceci: Comme vous pouvez probablement le dire, je suis toujours un filet. : / Quelqu'un peut-il m'aider avec le Seleciton ??
4 Réponses :
Changez la ligne d'une ligne de votre page PageranchorBuilder à cette fonction:
return '<li><a href="#">' + jQuery(slide).children("h3").eq(0).text() + '</a></li>';
Exactement. Tu es l'homme! Un beau gars aussi. Merci encore!
J'ai essayé avec cela et j'ai travaillé:
$(function() {
$('#featured .container').before('<ul id="nav">').cycle({
fx: 'scrollLeft',
speed: 300,
timeout: 5000,
next: '.next',
prev: '.previous',
pager: '#nav',
pagerAnchorBuilder: function(idx, slide) {
var img = $(slide).children('.thumb').children().eq(0).attr("src");
return '<li><a href="#"><img src="' + img + '" width="50" height="50" /></a></li>';
}
});
Ceci est la solution de recherche dans n'importe quel élément DOM:
pagerAnchorBuilder: function(idx, slide) {
return '<li><a href="#"> img src="' + jQuery(slide).find('img').attr('src') + '" width="70" height="50" / </a></li>';
}
Cela a bien fonctionné pour moi. J'ai eu du mal à trouver la source d'image tel qu'il était à l'intérieur d'une balise
Vous avez oublié le début et la fermeture de la balise <> , je suis reconnaissant de l'avoir dans votre message. merci ça m'aidez-moi.
Je pose cela, car cette question se présente comme un rang élevé. Je pense que ma solution est beaucoup plus robuste.
Je me suis éloigné de toute la chose de PageanchorBuilder, c'est que c'est trop encombrant pour faire quelque chose de fantaisie. C'est ce que j'ai trouvé mieux fonctionné et vous donne beaucoup plus de contrôle sur les pouces. P>
Première construction de votre scène de cycle et de votre bac thumb, comme celui-ci: P>
<div class="stage">
<div class="slide">Slide 1</div>
<div class="slide">Slide 2</div>
<div class="slide">Slide 3</div>
</div>
Cela fonctionne bien, comment puis-je ajouter une classe CSS active à l'élément actif du pouce? Merci
Mark, voulez-vous dire une classe active lorsque vous cliquez sur un pouce? Ou une classe active qui met à jour si le cycle est défini sur le cycle automatique?