Question

相当基本的问题，但我正在寻找一个jQuery内容滑块，没有按钮只是通过4个不同段落的内容连续淡入/淡出幻灯片。

我已经在Google上进行了搜索，似乎无法找到能够实现我想要的滑块 - 我希望有人可以推荐一个。

提前致谢。

Answer 1

你试过这个吗？ http://manos.malihu.gr/jquery-custom-content-scroller

这可能就是你在寻找什么。您可以自定义自己的滚动条或使用它们为您提供的多个选项之一。

我已经尝试过了，它真的很完美

Answer 2

我认为当您只想使用图像/视频时，NivoSlider就是您要搜索的内容。

可在此处找到：http://nivo.dev7studios.com/support/jquery-plugin-usage/ 当你向下滚动页面时，你会看到显示控件的真/假选项。

如果你想使用html内容，我听说的最后一件事就是nivoslider不具备这种能力。

因此，如果您想在幻灯片中使用html内容，请尝试这里提供的rhinoslider： http://rhinoslider.com/how-to-use/ 在链接页面上，您可以使用演示来满足您的需求。

但是，更多的信息会很好。应该是响应和事情吗？你想要显示什么内容？

希望这篇文章有所帮助。

问候，多米尼克

Answer 3

您可以尝试其中一些 -

http://delicious.com/anupdg/Content+slideshow

此致

Anup Das Gupta

Answer 4

您可以从我附加的链接中看到选项，以选择不同的过渡效果........

<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br">
<head>
    <title>Skitter - Slideshow for anytime!</title>
    <link href="css/skitter.styles.css" type="text/css" media="all" rel="stylesheet" />
    <script src="js/jquery-1.6.3.min.js"></script>
    <script src="js/jquery.easing.1.3.js"></script>
    <script src="js/jquery.skitter.min.js"></script>
    <script>
    $(document).ready(function() {
        var options = {
            numbers: false,// the thing required no anchoring or navigation
            navigation:false,
            animation: "random",
            velocity:0.2, //velocity of animation
            interval:4000// time gap between the transitions
        };
        $('.box_skitter_large').skitter(options);
    });
    </script>
</head>
<body>
<div id="page">
    <div id="content">
        <div class="border_box" style="width:200px" >
            <div class="box_skitter box_skitter_large" style="margin-left:152px;margin-top:34px">
                <ul>
                    <li><a href="#cube"><img src="images/1.jpg" class="cube" /></a><div class="label_text"><p>cube</p></div></li>
                    <li><a href="#cubeRandom"><img src="images/2.jpg" class="cubeRandom" /></a><div class="label_text"><p>cubeRandom</p></div></li>
                    <li><a href="#block"><img src="images/3.jpg" class="block" /></a><div class="label_text"><p>block</p></div></li>
                    <li><a href="#cubeStop"><img src="images/4.jpg" class="cubeStop" /></a><div class="label_text"><p>cubeStop</p></div></li>
                    <li><a href="#cubeHide"><img src="images/5.jpg" class="cubeHide" /></a><div class="label_text"><p>cubeHide</p></div></li>
                </ul>
            </div>
        </div>
    </div>
</div>
</body>
</html>

用于下载js和css文件并查看不同的过渡效果访问： http://thiagosf.net/projects/jquery/skitter/

jQuery内容滑块 - 没有按钮/淡入＆amp;转型

4 个答案: