【问题标题】:jQuery easySlider 1.7 - how do I add the next and previous buttons?jQuery easySlider 1.7 - 如何添加下一个和上一个按钮?
【发布时间】:2012-02-08 23:30:12
【问题描述】:

我在我正在开发的网站上安装了 easySlider 1.7。出于某种原因,无论我做什么,下一个和上一个按钮都不会出现。我对整个 jQuery 并不陌生,但在尝试了这么多不同的选项后,我完全被难住了。下面是我的 CSS 代码、滑块的 jQuery 和我的 html。请注意,我在名为“banner.js”的单独 .js 文件中有滑块 jQuery,并且我的 CSS 附加到主 CSS 文件。我真的可以忽略某些东西,但我一直在上下寻找解决方案。提前谢谢!

CSS:

#slider ul, #slider li{ 
        margin:0;
        padding:0;
        list-style:none;
        }   
    #slider, #slider li{ 
        height:290px;
        width:1024px;
        overflow:hidden;
        }   
    #slider{ 
        margin-left:0px;
        }   
    #prevBtn, #nextBtn{ 
        width:30px;
        height:77px;
        float:left;
        left:0px;
        top:50px;
        }   
    #nextBtn{ 
        left:1024px;
        }                                                       
    #prevBtn a, #nextBtn a{  
        display:block;
        width:30px;
        height:77px;
        background:url(../images/btn_prev.gif) no-repeat 0 0;   
        }   
    #nextBtn a{ 
        background:url(../images/btn_next.gif) no-repeat 0 0;   
        }

                            `

jQuery 幻灯片功能:

$(document).ready(function(){   
    $("#slider").easySlider({
        auto: true, 
        pause:3000,
        continuous: true,
        controlsShow:true,
        prevId:'prevBtn',
        nextId:'nextBtn'

    });
})`

HTML 标记:

<div id="wrapper">
<div class="nav">
</div>
<div class="banner">
<div id="slider">
    <ul>
    <li><img src="images/banner/img001.png" alt="001" /></li>

    <li><img src="images/banner/img002.png" alt="002" /></li>
        <li><img src="images/banner/img003.png" alt="003" /></li>
    </ul>
</div>
</div>
<div class="mxNav">
<p class="mxNavText"> Order Now! </p>
</div>

【问题讨论】:

    标签: jquery easyslider


    【解决方案1】:

    这是我测试您的代码的链接。您拥有的和我拥有的之间的唯一区别是图像和这些图像的文件路径。我会假设此时可能存在文件路径问题。

    http://d2burke.com/exp/es_test/

    我一直使用这个插件,甚至extended it's functionality。如果您愿意,请发布指向您的代码的链接。我很乐意看看

    【讨论】:

    • 感谢您的浏览!这绝对是一个菜鸟错误,CSS 中的图像路径不正确。我让他们都工作和风格。再次感谢您帮助我!
    猜你喜欢
    • 2014-09-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多