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代码。

alert和console.log不起作用...... 你可以在代码<span class="capik">Text 1</span>中看到“capik”类是缩略图标题......

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

但......警报和其他人不起作用...... 我猜JQuery会生成active和capik-no类......

因此，由于JQuery生成，系统无法找到这个<li>类。警报无法运行.. console.log无法与这些类一起运行.....

所以hasClass和其他人也无法运行......我无法解决使用活跃的拇指状态来隐藏capika-no类的标题....

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

请检查拇指图像元素（Ctrl-Shift-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

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

我认为，当<span class="capik">有类li

时，您需要的一点是隐藏标题active的CSS

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

悬停拇指时隐藏字幕：

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

警报，hasClass和其他没有工作的pikachoose滑块

1 个答案: