警告，hasClass和其他不能工作的pikachoose滑块

Question

这是我的网站：http://www.proservinformatika.hu/!orex/

我准确地添加了"pikachoose“图片库滑块插件(它是免费的- http://www.pikachoose.com)，它的工作非常好！你可以看到缩略图下面的完整图像。我终于解决了在大拇指中间做字幕的问题。

您可以看到<li class="active capik-no">拇指处于活动状态，您可以看到滑块在几秒钟后不断地更改图像。当滑块更改为另一个图像时，第一个当前<li class="active capik-no">更改为简单<li>，第二个<li>更改为<li class="active capik-no">。是的，这是一个自动滑块永恒的过程。

，我的问题是：，我尝试做alert() fn。就像这样：

        if ($('.pikachoose li').hasClass("active")) {
           alert('test');
        }

或

        if ($('.pikachoose li').hasClass("capik-no")) {
           alert('test');
        }

capik-no只是一个测试类。使用"display: none;" css代码。capik只是一个测试类。使用"display: block; position: absolute;" css代码。

警报和console.log不能工作..。在代码中可以看到<span class="capik">Text 1</span> "capik“类是缩略图标题.

我的计划是：试图将拇指的活动状态更改为:活动拇指状态没有标题。只有被动状态的拇指才有。我想用hasClass, addClass, removeClass的各种解决方案来解决这个问题。

但是..。警报和其他的不起作用..。我猜active JQuery生成了 capik-no 和类.

因此，特别是系统无法找到这个<li>类，因为JQuery？警报不能运行..。console.log不能与这些类一起运行……

所以hasClass 和其他人不能跑得太快.我也无法解决如何使用capika-no 类.来隐藏标题的活动拇指状态。

以下是js：http://www.proservinformatika.hu/!orex/js/jquery.pikachoose.js

请检查任一拇指图像元素(Ctrl I)。下面是简单的代码：

<div class="pikachoose">
    <ul class="jcarousel-skin-pika pika-thumbs">
        <li class="active capik-no">
            <div class="clip">
                <img ref="http://www.proservinformatika.hu/!orex//images/slider-main/big/1.jpg" src="http://www.proservinformatika.hu/!orex//images/slider-main/small/1.jpg" class="" style="display: inline; width: 100%; opacity: 0.4;">
                <span class="capik">Text 1</span>
            </div>
        </li>
        <li>
            <div class="clip">
                <img ref="http://www.proservinformatika.hu/!orex//images/slider-main/big/2.jpg" src="http://www.proservinformatika.hu/!orex//images/slider-main/small/2.jpg" class="" style="display: inline; width: 100%; opacity: 0.4;">
                <span class="capik">Text 2</span>
            </div>
        </li>
        <li>
            <div class="clip">
                <img ref="http://www.proservinformatika.hu/!orex//images/slider-main/big/3.jpg" src="http://www.proservinformatika.hu/!orex//images/slider-main/small/3.jpg" class="" style="display: inline; width: 100%; opacity: 0.451875827717631;">
                <span class="capik">Text 3</span>
            </div>
        </li>
        <li>
            <div class="clip">
                <img ref="http://www.proservinformatika.hu/!orex//images/slider-main/big/4.jpg" src="http://www.proservinformatika.hu/!orex//images/slider-main/small/4.jpg" class="active capik-no" style="display: inline; width: 100%; opacity: 1;">
                <span class="capik">Text 4</span>
            </div>
        </li>
    </ul>
</div>

我当前解决这个问题的代码是(但不工作.=/ ):

if($('.pikachoose li').hasClass('active')) {
    $('.pikachoose li span').addClass('capik-no');
    $('.pikachoose li span').removeClass('capik');
} else {
    $('.pikachoose li span').addClass('capik');
    $('.pikachoose li span').removeClass('capik-no');
}

请注意://我想将标题隐藏在拇指激活状态下！：(

Answer 1

我想从拇指的激活状态中隐藏标题。

我认为这里所需要的只是一些CSS来隐藏标题<span class="capik">当li有active类时。

.pika-thumbs .active .capik { display: none; }

拇指悬停时隐藏标题：

.pika-thumbs li:hover .capik { display: none; }