Question

我正在尝试在我的关于我们的页面中显示我的推荐。在那里，我使用3 divs水平样式，一次显示3个推荐。

这里我想尝试做的是我想添加一些滑动效果与查询消失前3 divs然后需要加载第二个3 divs与不同的推荐。等等..我做了HTML和CSS ..但不知道如何用查询做...可以任何身体帮我做这个.. ???

<div class="testimonials">
    <div class="cols">
        contents...1st time                    
    </div>
    <div class="cols">
        contents...1st time       
    </div>
    <div class="cols">
        contents...1st time       
    </div>

    <div class="cols">
        contents...2st time                    
    </div>
    <div class="cols">
        contents...2st time       
    </div>
    <div class="cols">
        contents...2st time       
    </div>

</div>


.testimonials {
    width: 640px; 
    height: 300px;
    //background: red; 
}

.cols {
    width: 150px;
    height: 200px;
    margin: 0 20px 0 0;
    background: gray;
    float: left;
}

任何评论，任何想法都非常感激......

谢谢..

Answer 1

这是一个很棒的jQuery轮播插件

http://sorgalla.com/projects/jcarousel/

Github： https://github.com/jsor/jcarousel

或

Github： https://github.com/SSilence/simple.carousel

请在此处查看 jsFiddle 演示：http://jsfiddle.net/enve/GWhaz/

前三个<li>首先显示，另外三个在2000秒后显示。

Answer 2

试试这个轻量级的javascript jQuery库： http://baijs.nl/tinycarousel/

Answer 3

这样的东西？ http://jsfiddle.net/gZkUV/1/

$('#id').show('slide', {direction: 'right'}, 1000);

Answer 4

如果您确实想要使用jquery，请使用已经在社区中构建的东西。这将是您从头开始创建的任何东西都是安全且灵活的选项。使用像 coin slider或jquery cycle plugin。他们有一些关于你应用插件的html标记的细节。跟着你，你就完成了。

使用jquery和javascript水平滑动div

4 个答案: