Question

我已经制作了一个自定义滑块..有点帮助..点击下一个按钮时我需要一些帮助定位图像。

我的codepen在这里 https://codepen.io/erayner/pen/LLBwOj

基本上当我点击下一个按钮时，我只想隐藏其中一个图像。

//example of one of the slides
<div class="row slide slide2">
        <div class="col-sm-6 slide2-container">
            <div class="slide2-container1">
                <h4>Burglar</h4>
                <p>A burglar looks for an easy entry point</p>
                <ul>
                    <li>Unlocked doors</li>
                    <li>Open windows</li>
                </ul>
                <p>To keep burglars out, effective security should</p>
                <p><span>Discover</span> them on the edge of your property before they get in.</p>
                <p><span>Enforce</span> existing security measures to maintain high security standards.</p>
                <p><span>Harden</span> security tools to make entry difficult.</p>
            </div>
            <div class="slide2-container2">
                <h4>Cyber Hacker</h4>
                <p>Cyber attackers look for easy entry points</p>
                <ul>
                    <li>Social engineering/phishing to get an unsuspecting user to expose their network credentials or install malware</li>
                    <li>Exploiting a vulnerability in a web-based application or service</li>
                </ul>
                <p>To keep attackers out, effective security should</p>
                <p><span>Discover</span> when malicious sites, applications or downloads are being accessed.</p>
                <p><span>Enforce</span> existing security measures to block this activity.</p>
                <p><span>Harden</span> security tools to make entry difficult before a connection is established.</p>
            </div>
        </div>
        <div class="col-sm-6 slide2">
            <img src="http://ciscosecurity.co.nz/test-images/state-2.svg" class="svg svg1">
            <img src="http://ciscosecurity.co.nz/test-images/state-1.svg" class="svg">
        </div>
    </div>

//jquery im trying to get to hide '.active .svg(1,2,3)'
jQuery('.arrow-left, .arrow-right').click(function (e) {
    e.preventDefault();
    if ($('.active').hasClass('slide2')) {
        $('.svg2').hide();
    } else {
        $('.svg2').show();
    }
    t($(this));
});

任何帮助非常感谢。干杯

编辑：更新了jQuery - ＆gt; ＆＃39;以前＆＃39;按钮不能使用代码，但接下来会有＆＃39;确实

Answer 1

这里只是针对正确的元素是一个我认为正在尝试做你想做的事情的例子。

https://codepen.io/natedog213/pen/RgJZYd?editors=1111

if ($('.slide2').hasClass('current')){
   $('.slide2').children().last().css('top', '-300px');
}else{
   $('.slide2').children().last().css('top' , '100px');
}

在滑块内定位图像

1 个答案: