0

我遇到了一个非常奇怪的问题,我不知道如何解决。基本上,我正在使用anythingSlider 并且一切正常。在每张幻灯片中都有 5 张图片,当用户将鼠标悬停在它们上面时,会出现一个小图片标题,当用户将其移出图片时,标题就会消失。我有 3 张带有这些图像的幻灯片,因此总共有 15 张图像。现在 - 该功能在前 2 张幻灯片上运行良好,但在最后一张幻灯片上运行良好(即包含 10-15 的图像的幻灯片)有人知道为什么吗?这是我用来显示标题的代码:

<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>

...在幻灯片中,我正在使用此代码来调用这些方法:

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

这是标题 div 的结构:

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

1 回答 1

1

主要问题是,AnythingSlider 创建了您的第一个和最后一个面板的克隆。它将第一个面板的克隆放在末尾,将最后一个面板的克隆放在开头。主要原因是在最后一个面板上单击下一步或在第一个面板上单击返回时,使无限幻灯片看起来平滑。

因为您的标题幻灯片有 id,所以脚本会查找第一个(克隆)面板中包含的 id,而不是您想要的面板。

最新版本的 AnythingSlider (1.5.7+) 做了两件事:

  1. 它现在完全删除了克隆面板中的所有 id
  2. infiniteSlides如果您将新选项设置为 false ,它根本不会克隆面板。当为 false 时,单击最后一个面板上的下一步将“倒回”内容。在第一个面板上单击上一步会将幻灯片快进到最后。
于 2011-03-01T02:45:31.970 回答