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

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


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