Question

我正在使用此页面上的flexslider工作：http://www.intensetomatoes.co.nz/story-timeline/

我只是想知道滑块在移动设备中无法正常工作的可能原因。

我使用Genesis主题为网站提供wordpress。

必要的代码如下：

<div id="timewrap" class="slidewrap">
        <h1>The Full Intense story...</h1>
        <div id="timeline-section" class="flexslider">
            <ul class="slides">
                <?php while($the_query->have_posts()): $the_query->the_post();?>
                    <li>
                        <div class="col_one">
                            <img src="<?php the_field('timeline_image'); ?>" alt="<?php the_title(); ?>"/>
                        </div>
                        <div class="col_two">
                            <h1><?php the_title(); ?></h1>
                            <div class="description"><?php the_content(); ?></div>
                        </div>

                    </li>
                <?php endwhile; wp_reset_query(); ?>
            </ul>
        </div>

Flex Slider Code：

 $('#control').flexslider({
    animation: "slide",
    controlNav: false,
    directionNav: false,
    animationLoop: false,
    slideshow: false,
    itemWidth: 50,
    itemMargin: 6,
    asNavFor: '#timeline-section'
  });
  $('#timeline-section').flexslider({
    animation: "slide",
    controlNav: false,
    animationLoop: false,
    controlsContainer: ".slidewrap",
    slideshow: false,
    sync: "#control"
  });

关于如何解决这个问题，我现在还不知道。如何解决这个问题的任何想法将是一个很大的帮助。

Answer 1

我已经修好了！刚刚发现由于某些响应式媒体查询，滑块已放置在其原始位置：

@media only screen and (max-width: 1023px){
    .site-inner {
        padding-left: 0%;
        padding-right: 0%;
    }
}

Flex Slider无法在手机上运行

1 个答案: