Переполнение горизонтальной прокрутки в CSS с помощью ползунка jQuery - PullRequest
Новая
       28

Переполнение горизонтальной прокрутки в CSS с помощью ползунка jQuery

3 голосов
/ 17 мая 2010

Я пытаюсь настроить полноэкранный слайдер jquery. Я разбил проект на два этапа: 1) CSS и 2) JS.

1) CSS , ниже - изображение того, для чего я снимаю (без фиксированной высоты), а ниже - код, который у меня пока есть, который не работает.

Пример http://i43.tinypic.com/a1ocxj.jpg

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <style type="text/css">

        /* Positioning */
        #container { width: 2500px; }
        .block { display: inline; }

        /* Styling */
        .block img { padding: 5px; }

    </style>
</head>
<body>
    <div id="container">
        <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div>
        <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div>
        <div class="block"><img src="http://i42.tinypic.com/1zp2poz.gif"></div>
    </div>
</body>
</html>

2) Javascript , используя jquery. Я бы хотел, чтобы элементы div скользили влево при нажатии на них ... как, например, jQuery Coda Slider , если это возможно.

Спасибо, любая помощь приветствуется.

Ответы [ 2 ]

0 голосов
/ 17 мая 2010

Посмотри эту вещь: http://apirocks.com/html5/html5.html (Тест с Chrome)

0 голосов
/ 17 мая 2010

Вы должны начать с установки CSS контейнера div, чтобы фиксированная ширина и переполнение были скрыты, поэтому показывается только то, что находится внутри области: 

#container{
  width:500px;
  height:200px;
  overflow:hidden;
}

Как вы хотели, чтобы слайдер работал? Автоматический? Нажатие кнопки? Есть несколько плагинов, которые могут позаботиться об этом автоматически

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...