jQuery easySlider 1.7 - как добавить следующую и предыдущую кнопки? - PullRequest
0 голосов
/ 08 февраля 2012

У меня установлен easySlider 1.7 на веб-сайте, над которым я работаю. По какой-то причине, что бы я ни делал, следующая и предыдущая кнопки вообще не отображаются. Я не новичок во всем, что связано с jQuery, но я совершенно ошарашен, попробовав так много разных вариантов. У меня есть ниже мой код для CSS, jQuery для слайдера и мой HTML. Обратите внимание, что у меня есть слайдер jQuery в отдельном файле .js, который называется «banner.js», и мой 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 Slide:

$(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>

1 Ответ

0 голосов
/ 08 февраля 2012

Вот ссылка, где я проверял ваш код. единственное различие между тем, что у вас есть, и тем, что у меня есть, - это изображения и пути к файлам к этим изображениям. На этом этапе я бы предположил, что может быть проблема с путем к файлу.

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

я использую этот плагин ВСЕ время и даже расширил его функциональность . опубликуйте ссылку на ваш код, если хотите. я был бы рад взглянуть

...