[jQuery] jQuery cycle and handling new request/page changed

[JozefSevcik]

Hi all,

I have a slideshow, which repeats on different pages (for example /
index-1.html, /index-2.html etc).
Slideshow is in main template, shared by all other pages.
What I'm trying to do is if page is changed from index-1 to index-2
(e.g. user clicks on some link on page),
slideshow on index-2 will start where slideshow on index-1 ended.
I'm using cookie for this - storing index of current slide every time
cycle.after event occurs
and try to start from this index if cookie is set:

<script type="text/javascript">
jQuery(document).ready(function() {

var startIndex = getNext();
if (startIndex == null)
{ startIndex = 0; }

$('#hps').cycle({
  fx:    'fade',
  speed:  3000,
  startingSlide: startIndex,
  after: function (curr, next, opts) {
    setNext(opts.currSlide);
    }
  });
});

function setNext(current)
{
 jQuery.cookie('slideShowIndex', current);
}

function getNext()
{
 return jQuery.cookie('slideShowIndex');
}
</script>
</body>
</html>

The problem is that it does not works as expected - sometimes on new
page it start from wrong image index (0), sometimes it just stops and
in case it works, it does not start on corrent index.

What am I doing wrong ?

Thanks,
Jozef