jQuery.slides () не работает

Question

Я использую плагин SlidesJS jQuery и вызываю

jQuery.slides();

Однако это работает неправильно.Вместо этого изображения просто все отображаются (как и следовало ожидать без плагина).

Почему это не работает и как я могу заставить это работать?

Я уверенjavascript запускается, когда я поместил alert() выше и ниже моего оператора slides () для проверки.

Вот моя разметка:

<div class="slides">
    <div class="slides_container">
        <div>
            <img src="Images/sample_banner.png" />
        </div>
        <div>
            <img src="http://placehold.it/984x111" />
        </div>
        <div>
            <img src="http://placehold.it/984x111/ff0000" />
        </div>
    </div>
</div>


 <div class="left_arrow"><a href="#"><img src="Images/left_arrow.png" alt="left arrow control" /></a></div>
 <div class="right_arrow"><a href="#"><img src="Images/right_arrow.png" alt="right arrow control" /></a></div>

Вот мой CSS:

.banner
{
    width:984px;
    border-left:solid 7px #FFFFFF;
    border-right: solid 7px #FFFFFF;    
    z-index:1;
    position:relative;
}

    .banner .slides
    {
    }
        .banner .slides .slides_container {
            width:984px;
            height:111px;
        }
            .banner .slides .slides_container div
            {
                width:984px;
                height:111px;
                display:block;
            }


.left_arrow
{
    position:absolute;
    z-index:2;
    width:25px;
    left:0px;
    top:38px;

}

.right_arrow
{
    position:absolute;
    z-index:3;
    width:25px;
    left:960px;
    top:38px;
}

Вот мой JS:

$(document).ready(function () {
        $('.slides').slides({
           next: 'right_arrow'
           , prev: 'left_arrow'
           , pagination: false
         });
    });

Answer 1

Даже если ваш вопрос в основном решен. Тогда были некоторые другие проблемы с макетом.

1. Как могут .banner .slides применяться, если нет <div class="banner" />?
2. Неправильное размещение стрелок и их CSS не были оптимальными
3. Вам не нужно устанавливать ширину или высоту в стольких местах
4. Нумерация страниц все еще появлялась, хотя вы этого не хотели
5. Странная проблема со стрелками и z-index

И было еще несколько мелких проблем, которые я исправил, сделал код оптимальным и сухим.

Мой пример: http://jsfiddle.net/hobobne/RSncf/1/

Answer 2

В вашем javascript вы нацелены на id # slides , а в вашей разметке ваш содержащийся элемент div имеет объявление класса - так что измените вашу разметку на

и дайте этому вихрь .

Answer 3

Да, я сделал то же самое.

Это потому, что функция не .slides, а .slidesjs

По крайней мере, это то, что исправило это для меня.