当我单击下一个或上一个链接时,JQuery Carousel 会闪烁

罗纳尔多·斯科蒂

我正在创建一个轮播来显示自定义帖子类型。循环工作正常,我设法按照我想要的方式获得布局。但是,当用户单击下一个/上一个链接时,转换后轮播会闪烁,然后再次弹出。

这是现场演示的链接:https : //goace.vc/teste-exits/

轮播代码:

        <div id="exits" class="carousel" data-ride="carousel">
            <div class="carousel-inner" role="listbox">

              <?php
              $current = 0;

              if( $exits->have_posts() ): while( $exits->have_posts() ) : $exits->the_post();

                if ($current == 0) {
                  $exitStatus = 'active';
                } else {
                  $exitStatus = '';
                }
                ?>

                <?php if ($current % 2 === 0) { ?>
                  <div class="item <?=$exitStatus?>">
                <?php } ?>


                <div class="col-sm-6">
                    <div class="exit-box">
                      <div class="col-xs-7">
                        <div class="exit-img" style="background-image: url('https://goace.vc/wp-content/uploads/2017/04/0028_Fundacity.png')"></div>
                      </div>
                      <div class="col-xs-5 exit-details">
                        <h3><?= get_the_title(); ?></h3>
                        <hr>
                        <p><?= the_excerpt(); ?></p>
                        <hr class="half-line">
                        <?php
                          $tipoExit = wp_get_post_terms(get_the_ID(), 'tipo_exit', array("fields" => "names"));
                          $anoExit = wp_get_post_terms(get_the_ID(), 'ano_do_exit', array("fields" => "names"));
                        ?>
                        <p><small>Exit: <b><?= $tipoExit[0] ?></b><br>Ano: <b><?= $anoExit[0] ?></b></small></p>
                      </div>
                    </div>
                  </div>

                  <?php
                    $current++;
                    if ($current % 2 === 0) {
                  ?>
                    </div>
                  <?php } ?>

                <?php endwhile; endif; ?>

              </div>
                <a data-slide="prev" href="#exits" class="left carousel-control">‹</a>
                <a data-slide="next" href="#exits" class="right carousel-control">›</a>
              </div>

关于是什么原因造成的任何想法?

非常感谢!

南方

理想情况下,代码最好。然而,通过检查站点,该类slider似乎在滑动时刷新了轮播,它添加了in_progress设置此行为类。

您可以slide从元素中删除类<div id="exits" class="carousel slide" data-ride="carousel">

至:

<div id="exits" class="carousel" data-ride="carousel">

这将停止闪烁但会移除滑块效果(图像仍会切换但没有视觉效果)。如果您分享相关代码,我们可以尝试从那里解决它。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

过渡到下一个项目时,如何修复iPhone上的Bootstrap Carousel闪烁/闪烁/闪烁?(包括视频示例)

单击下一个/上一个时,滑块会跳过一张幻灯片

单击Bootstrap 4 Carousel的下一个按钮时,第一个幻灯片计数不起作用

我有一个按钮。当我按下一个按钮时,一个数字会减少数据库中的数字。我希望每次都重复

v-carousel 在移动到下一个项目时跳过

当我单击一个按钮时,不同的按钮在kivy recycleview中闪烁

当我单击“下一个/上一个”按钮时,jQuery DatePicker消失

使用Owl Carousel 2.0显示下一个和上一个项目的一部分

如何手动替换默认的“Slick Carousel”自动生成的上一个-下一个箭头按钮?

触发“ vue-owl-carousel”包Vue.js中的下一个和上一个元素

当我在JavaScript上单击下一个和上一个时,如何设置数组的顺序?

寻找一个jQuery Radio Carousel

UI Bootstrap控件uib-carousel绑定到下一个事件

Bootstrap Carousel-下一个容器不可见

如果我在输入需要整数时输入一个浮点数,它会更新下一个浮点数值。为什么会这样?

Angular bootstrap Carousel - 如何在角度组件中移动到 ng-bootstrap carousel 的下一个图像?

为什么当我单击下一个或上一个时,完整的日历jquery插件无法按预期工作?

当我单击“下一个/上一个”按钮时,如何在jQuery UI日期选择器中制作月份变化的动画

为什么显示时图像会闪烁?

多个角度选择-更改一个值会影响下一个选择

即使单击下一个按钮,脚本也会从第一页获取相同的结果

Bootstrap Carousel Error == TypeError:$(...)。carousel不是一个函数

当我单击下一个和上一个箭头时,添加和删除分页.active类

当我订阅一个不存在的主题时,Firebase 是否会创建一个主题?

当我将另一个图像居中时,一个图像会移动

当我点击一个锚点来定位一个元素时,导航栏会阻止内容

Bootstrap 5 - Carousel 不会滑动到下一个图像 - 从 bootstrap 4 升级到 bootstrap 5

当我实现一个空白接口时,我会赢什么?

淡入下一页时,jQuery 淡入淡出过渡会导致奇怪的闪烁