html - Can someone explain how to make this jQuery slider autoplay and loop? -


here's slider i'm trying loop:

http://sixrevisions.com/demo/slideshow/final.html

i able add

timer = window.setinterval("autoslide()", 5000);  function autoslide(){ jquery("#rightcontrol").click(); }

to end of jquery coding , move next slide every 5 seconds. however, after last slide, continues "click" rightcontrol button. how loop after last slide?

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){   var currentposition = 0;   var slidewidth = 560;   var slides = $('.slide');   var numberofslides = slides.length;    // remove scrollbar in js   $('#slidescontainer').css('overflow', 'hidden');    // wrap .slides #slideinner div   slides     .wrapall('<div id="slideinner"></div>')     // float left display horizontally, readjust .slides width     .css({       'float' : 'left',       'width' : slidewidth     });    // set #slideinner width equal total width of slides   $('#slideinner').css('width', slidewidth * numberofslides);    // insert controls in dom   $('#slideshow')     .prepend('<span class="control" id="leftcontrol">clicking moves left</span>')     .append('<span class="control" id="rightcontrol">clicking moves right</span>');    // hide left arrow control on first load   managecontrols(currentposition);    // create event listeners .controls clicks   $('.control')     .bind('click', function(){     // determine new position     currentposition = ($(this).attr('id')=='rightcontrol') ? currentposition+1 : currentposition-1;  // hide / show controls managecontrols(currentposition); // move slideinner using margin-left $('#slideinner').animate({   'marginleft' : slidewidth*(-currentposition) });   });    // managecontrols: hides , shows controls depending on currentposition   function managecontrols(position){     // hide left arrow if position first slide     if(position==0){ $('#leftcontrol').hide() } else{ $('#leftcontrol').show() }     // hide right arrow if position last slide     if(position==numberofslides-1){ $('#rightcontrol').hide() } else{ $('#rightcontrol').show() }   }  });

i think this jsfiddle you're looking for.

basically replace this:

currentposition = ($(this).attr('id')=='rightcontrol') ? currentposition+1 : currentposition-1;

with below, checks being @ 1 end of slideshow:

if ($(this).attr('id') == 'rightcontrol') { currentposition = currentposition >= slides.length - 1 ? 0 : currentposition + 1; } else { currentposition = currentposition <= 0 ? slides.length - 1 : currentposition - 1; }

i went ahead , added check moving left well, won't need it.


Comments

Post a Comment

Popular posts from this blog

android - Get AccessToken using signpost OAuth without opening a browser (Two legged Oauth) -

i using signpost oauth access data magento server. have read various tutorials on same , reach point open browser user can enter credentials. however, per requirement have automate part. hence, user should not browser page. have set-up done on server side ( magento ), hit url , returned call page. same through program in android. i have tried below, consumer = new commonshttpoauthconsumer(key, secret); provider = new commonshttpoauthprovider(oauth_init_url,access_token_url, authorize_url); try { provider.retrieverequesttoken(consumer, oauth.out_of_band); log.d("tokens" , consumer.gettoken() + " -- " + consumer.gettokensecret()); } and request tokens. dont know how bypass next step. tried directly accessing accesstoken (stupid of me) provider.retrieveaccesstoken(consumer, "mycallback://callback"); no luck, ends in oauth.signpost.exception.oauthnotauthorizedexception: authorization failed (server replied 401). ...
Read more

org.mockito.exceptions.misusing.InvalidUseOfMatchersException: mockito -

getting error org.mockito.exceptions.misusing.invaliduseofmatchersexception: invalid use of argument matchers! 1 matchers expected, 2 recorded. exception may occur if matchers combined raw values: //incorrect: somemethod(anyobject(), "raw string"); when using matchers, arguments have provided matchers. example: //correct: somemethod(anyobject(), eq("string matcher")); at when( getprogramservice .callservice(any(getprogramtype.class))) .thenreturn(jaxbresponse); please explain error , possible resolution the code posted looks fine; don't see problem it. code before or above causing exception. key here: invalid use of argument matchers! 1 matchers expected, 2 recorded. any , used above, doesn't return "special kind of null" or "special kind of getprogramtype"; don't exist. instead, returns null , side effect puts matcher on stack. whe...
Read more

google shop client API returns 400 bad request error while adding an item -

i'm working on solution add items in google shopping market java application. following tutorial real mess because of missing classes of laste release, after setting 1.5-beta maven managed make base example typecheck correctly classes. still can make simple task of adding 1 item. instead of posting whole code i'm posting part creates product feed. private product createproduct(string id) { product product = new product(); product.title = "red wool sweater"; product.content = new content( "text", "comfortable , soft, sweater keep warm on " + "cold winter nights. red , blue stripes."); product.appcontrol = new appcontrol(); product.appcontrol.addrequireddestination("productads"); product.externalid = id; product.lang = "it"; product.country = "it"; product.condition = "nuovo"; product.price = new price("eu...
Read more