0

我创建了一个幻灯片,它可以在桌面上完美运行,但on('click')在移动版本中不可用。但是,单击对于其他移动按钮效果很好。

html

<section id="interests" class="container content-section text-center">
    <div class="row">
        <div class="col-md-12">
            <h2><span class="en">Interests</span><span class="es">Intereses</span></h2>
            <style id="sliderLanguage"> </style>
            <div class="row">
                <div class="col-md-6 col-xs-12">
                    <div id="sliderBubble">
                        <img class = "bubbles currentBubble" src="img/sBubblePink.png">
                        <img class = "bubbles" src="img/sBubble.png">
                        <img class = "bubbles" src="img/sBubble.png">
                        <img class = "bubbles" src="img/sBubble.png">
                        <img class = "bubbles" src="img/sBubble.png">
                        <img class = "bubbles" src="img/sBubble.png">
                    </div>                       
                </div>
            </div>
        </div>
    </div>
</section>

脚本.js

for (var i = 0; i < numClips; i++) {
    $($bubbles[i]).on('click', function () {
          alert('test') 
    });
 }

更新这是引导 css。如果我不包含 boostrap,则点击在移动设备上可以正常工作,但我不知道 css 的哪一部分导致它失败。

更新 2它特别是 Boostrap 中的网格系统。我正在玩自定义 boostrap 下载,我可以使用每个组件,除了破坏幻灯片的网格系统。

4

0 回答 0