Question

我的基本Jquery slider(bjqs)在我只提供一个li元素之后无法正常工作...结果没有显示我放在li标签中的内容....如果我放了4个li元素，它会完美地工作。

这里有什么问题？

4 li（工作正常）：链接（http://jsfiddle.net/nikhilvkd/DaXG7/9/）

    <article class="salon_cvrs" id="banner-fade">                       
                            <ul class="bjqs">
                                <li>
                                    <article class="saloon-box">
                                            <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                    </article>
                                    <article class="saloon-box">
                                            <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                    </article>
                                    <article class="saloon-box">
                                            <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                    </article>
                                    <article class="saloon-box">
                                        <article class="featured">
                                            <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                    </article>
                                </li>

                            <li>
                                <article class="saloon-box">
                                            <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                </article>
                                <article class="saloon-box">
                                    <p>Everyone loves an effortless hairstyle that also hints at glamour. And an easy up-do that doesn't feel too 'done' is exactly the way to go to create it. </p>
                                </article>
                                <article class="saloon-box">
                                            <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                </article>
                                <article class="saloon-box">
                                    <article class="featured">
                                            <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                </article>
                            </li>
                            </ul>
                        </article>

只有一个li（不工作）:( http://jsfiddle.net/nikhilvkd/xD4FL/9/）

<article class="salon_cvrs" id="banner-fade">                       
                        <ul class="bjqs">
                            <li>
                                <article class="saloon-box">
                                        <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                </article>    
                                <article class="saloon-box">
                                        <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                </article> 
                                <article class="saloon-box">
                                        <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                </article> 
                                <article class="saloon-box">
                                        <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."</p>
                                </article>                        
                            </li>
                        </ul>
                    </article>

Answer 1

当只有一个项目作为幻灯片提供时，您所拥有的脚本看起来不会更改布局。而它消失的事实是因为你自己的风格

li.bjqs-slide{
    position:absolute;
    display:none;
}

如果您将display: none改为display: block或inline-block，则会显示幻灯片

基本Jquery Slider（bjqs）不能与一张幻灯片一起使用

1 个答案: