Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Try this way making it more generic:</p> <pre><code> var $listItems = $("#site_slideshow_inner_text").children('li'), fadeDuration = 300, interval; $listItems.not(':first').hide(); function showSlide(elm) { //fadeout the visible one and fade in the element passed to the function $listItems.filter(':visible').fadeOut(fadeDuration, function () { elm.fadeIn(fadeDuration); }); } function autoSlide() { //auto slide is set up to go forward interval = setInterval(function () { showSlide( getNextElement('next')); }, 1000); } $('#prev, #next').on('click', function () { stopAutoSlide(); //stop auto slide showSlide(getNextElement(this.id)); //Get next element by passing in prev/next as argument which are the id of the element itself. }); //Here is the major section that does all the magic of selection the element function getNextElement(direction) { //Here direction will be prev or next they are methods on jquery to select the element, so it will select correspoding element by executing that specific function i.e next() or prev(). // Also set up a fallback if there is no element in next or prev you need to go to last or first and execute it. var $next = $listItems.filter(':visible')[direction](), fallBack = (direction === 'prev' ? 'last' : 'first'); return !$next.length ? $listItems[fallBack]() : $next; } function stopAutoSlide() { $listItems.stop(true, true, true); //just clean up the animation queues clearInterval(interval); //clear the interval } autoSlide(); //Kick off auto slide </code></pre> <p><strong><a href="http://jsfiddle.net/K3zdB/" rel="nofollow">Demo</a></strong></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload