bxslider 仅适用于垂直滚动，而不适用于水平滚动

Question

我正在尝试在网站侧边栏上实现 bxslider，但由于某种原因，当我将模式设置为“水平”时，它仅在我将模式设置为“垂直”时才有效，这应该是默认设置，或者放模式完全没有，滑块过渡不起作用。我正在尝试完成一个滑块，一次显示一张幻灯片并自动转换到下一张幻灯片，但即使垂直滚动工作，我仍然必须手动点击寻呼机才能到达下一张幻灯片。我很好奇这个问题。

<ul class="bxslider">
    <li>
        <div>
            <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide1.png" />
            <br>
            <quote>“Axon Radiology was reliable and timely with great response on any questions or issues.”</quote>
            <hr>
            <p>Brandon Selle</p>
            <span>Northeast Missouri Imaging Associates</span>
        </div>
    </li>
    <li>
        <div>
            <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide2.png" />
            <quote>“We changed radiology groups due to inaccurate reads from our previous vendor. We are extremely happy with Axon Radiology and the quality of service they are providing for our company. I believe Axon Radiology takes pride in the performance of their radiologists. We get speedy turnaround and excellent reporting from this company.”
                </p>
                <hr>
                <p>Theresa Summers</p>
                <span>Georgia Emergency Associates</span>
        </div>
    </li>
    <li>
        <div>
            <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide3.png" />
            <quote>“Our prior teleradiology services had long wait times for the reports, even after calling and stating the patient was a priority patient. For one service the reports were not accurate in addition to the extended wait time. Axon Radiology is dependable, accurate and provides fast report turnaround times. We are very pleased with the services provided and are happy to recommend you to others."</quote>
            <hr>
            <p>Tammy Cullen</p>
            <span>Cypress Creek ER</span>
        </div>
    </li>
    <li>
        <div>
            <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide4.png" />
            <quote>“Excellent service with results we can trust.”</quote>
            <hr>
            <p>Yadira Sanchez</p>
            <span>Saddleback Family & Urgent Care Medical Group</span>
        </div>
    </li>
    <li>
        <div>
            <img class="img-responsive" src="/wp-content/themes/axon-responsive/images/slide2.png" />
            <quote>“Axon helps us achieve this goal by providing over reads in as little as 20 minutes. Our previous provider was unable to do this. We are very happy with the service provided by Axon Radiology. It is easy and the staff are very helpful and easy to work with. Every time that I have reached out for help or more information about an interface, etc. I have received support and guidance. I appreciate the effort Axon puts into helping their customers grow.”</quote>
            <hr>
            <p>Lisa Horton</p>
            <span>Georgia Emergency Associates</span>
        </div>
    </li>
</ul>

我的 jQuery

jQuery(function ($) {
 $(document).ready(function(){
    $('.bxslider').bxSlider({
        mode: 'horizontal',
        slideWidth: 240,
        minSlides: 1,
        slideMargin: 10,
        controls: 'false',
        pager: 'true',
        moveSlides: '1',
        autoStart: 'true',
        auto: true;
 });
});
});

Answer 1

我能够解决这个问题。这是一个 css 错误，我给 bxslider 一个最大宽度。