2013-05-10 13 views
7

Ciao Ive è appena passato da Keyframes a Cycle2 (http://jquery.malsup.com/cycle2/) come un modo di mostrare le immagini, mi sono scambiato a ciclo2 poiché credevo che questo mi avrebbe permesso di creare i collegamenti delle immagini, ho solo bisogno di una delle immagini per un collegamento non tutti in modo che quando la presentazione arriva alla slitta il collegamento è attivo,Cycle2 make images links

<img src="/images/promo1.jpg"> 
<img src="/images/promo2.jpg"> 
<img src="/images/promo3.jpg"> 
<img src="/images/promo4.jpg"> 

questo funziona presentazioni belle perfetta, presto al provo

<a href="http://www.google.co.uk"> 
<img src="images/promo2.jpg"></a> 

solo su una delle immagini, lo butta fuori dalla presentazione e lo mostra sotto come se fosse il suo Immagine.

Qualsiasi aiuto apprezzato

Grazie

risposta

11

From the Cycle2 FAQ

voglio usare le diapositive che non sono immagini. Come faccio a dire a Ciclo2 quali sono le mie diapositive?

Utilizzare l'attributo diapositive del ciclo di dati per fornire un selettore jQuery che identifica gli elementi all'interno del contenitore che sono diapositive. Ad esempio, se la presentazione è un ul con Li scorre è necessario impostare l'attributo in questo modo: a ciclo dati scivoli = "li"

<ul class="cycle-slideshow" data-cycle-slides="li"> 
    <li><img src="path/to/some/image1.jpg"></li> 
    <li><img src="path/to/some/image2.jpg"></li> 
    <li><img src="path/to/some/image3.jpg"></li> 
</ul> 

Nel tuo caso, probabilmente bisogno di qualcosa come:

<ul class="cycle-slideshow" data-cycle-slides="li" data-cycle-fx="scrollHorz"> 
    <li><a href="http://www.example.com"><img src="http://placehold.it/350x150"/></a></li> 
    <li><a href="http://www.example.com"><h2>This is a non-image slide</h2></a></li> 
    <li><a href="http://www.example.com"><img src="http://placehold.it/350x150"/></a></li> 
    <li><a href="http://www.example.com"><h2>This is a non-image slide</h2></a></li> 
</ul> 

Working Example

+0

grazie! molto apprezzato – Coco

1

sarebbe corretto specificare il protocollo - "http: //"

<ul class="cycle-slideshow" data-cycle-slides="li"> 
    <li><a href="http://www.google.co.uk"><img src="path/to/some/image1.jpg"></a></li> 
    <li><a href="http://www.google.co.uk"><img src="path/to/some/image2.jpg"></a></li> 
    <li><a href="http://www.google.co.uk"><img src="path/to/some/image3.jpg"></a></li> 
</ul> 
+1

Rimuovi questa RISPOSTA e pubblica il tuo suggerimento di correzione come commento sotto [risposta di apaul] (http://stackoverflow.com/a/16485594/517705). Se non vuoi ottenere più downvotes. – Sk8erPeter