Semplice ticker (jQuery)
-
25-09-2019 - |
Domanda
<ul>
<li><a href="#">one</a></li>
<li><a href="#">two</a></li>
<li><a href="#">three</a></li>
</ul>
Vorrei mostrare solo uno li
in un momento usando l'effetto diapositivo, questo è tutto. Vorrei evitare di usare i plugin per qualcosa di così semplice.
Grazie in anticipo per il vostro aiuto.
Soluzione
Ho fatto qualcosa di semplice per te (in base alla tua descrizione), solo per indicarti nella giusta direzione:
Controllalo qui:http://jsfiddle.net/meo/acenh/234/
function slider(container, delay){
$container = $(container) // select the container elements and store them in a variable
if ( !$container.length ){ return fasle; } // checks if the slider exists in your dom. if not the function ends here...
var slides = $container.length, // gives back the total LI's you have
slide = 0 // set the actual li to show
setInterval(function(){ // set a Interval for your main function
if (slide == slides - 1) { // if the actual slide is equal the total slides (-1 because eq is 0 based and length gives back the number of elements in the jQuery object) the slide counter is set to 0
$container.slideDown(); // and all slides a shown again
slide = 0;
} else {
$container.eq(slide).slideUp(); //slides the selected slide up i think you could think of a solution with .next() instead of eq()
slide++; // slide counter +1
}
}, delay)
}
slider('ul > li', 2000); // call your slider function
Altri suggerimenti
La tua domanda menziona già JQuery come quadro di scelta JavaScript. Il posto migliore che puoi iniziare sono i documenti jQuery su Nascondose:
e scivolare:
http://api.jquery.com/slideup/
http://api.jquery.com/slidedown/
http://api.jquery.com/slidetoggle/
Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow