Question

I’m experiencing a really weird issue which I do not know how to solve. Basically, I’m using anythingSlider and everything is working fine. In every slide there are 5 images and when user hovers over them a small image caption appears and when user moves it out of the picture the caption disappears. I have 3 slides with those images so that makes 15 images in total. Now – the function works fine on the first 2 slides but not on the last one (i.e. slide containing images from 10-15)Does anyone know why?
This is a code I’m using for getting caption to appear:

<script type="text/javascript">

function is_child_of(parent, child) {
            if( child != null ) {           
                while( child.parentNode ) {
                    if( (child = child.parentNode) == parent ) {
                        return true;
                    }
                }
            }
            return false;
        }
function hide_thumb_caption(element, event, id) {
            var current_mouse_target = null;
            if( event.toElement ) {             
                current_mouse_target             = event.toElement;
            } else if( event.relatedTarget ) {              
                current_mouse_target             = event.relatedTarget;
            }
            if( !is_child_of(element, current_mouse_target) && element != current_mouse_target ) {
                $('#slider_thumb_'+id).slideUp('fast');
            }
        }

function show_thumb_caption(id) 
{
            $('#slider_thumb_'+id).slideDown('fast');
}
</script>

… and inside slides I’m using this code to invoke those methods:

<div class="top_slider_thumbs" onmouseover="show_thumb_caption(<?php the_ID(); ?>);" onmouseout="hide_thumb_caption(this, event, <?php the_ID(); ?>);">

This is how the caption div is structured:

<div class="top_slider_cap" id="slider_thumb_<?php the_ID(); ?>"><?php the_title();?></div>

Answer 1

The main problem is that AnythingSlider creates a clone of your first and last panel. It puts the clone of the first panel at the end and the clone of the last panel at the beginning. The main reason is to make the inifinte slide appear smooth when clicking next on the last panel or clicking back on the first panel.

Because your caption slides have id’s, the script is finding the id’s contained in the first (cloned) panel and not the panel you intended.

The latest version of AnythingSlider (1.5.7+) does two things:

1. It now completely removes all of the id’s in the cloned panels
2. It will not clone the panels at all, if you set the new infiniteSlides option to false. When false, clicking next on the last panel will “rewind” the content. And clicking previous on the first panel will fast-forward the slides to the end.