jQuery div слайдер страницы с экрана, без горизонтальной полосы прокрутки браузера - PullRequest
Новая
       10

jQuery div слайдер страницы с экрана, без горизонтальной полосы прокрутки браузера

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

Я ищу плагин для слайдера div jQuery, который скользит по горизонтали от страницы, отображая больше элементов div по мере открытия окна браузера. Мне нравится jQuery Coda Slider ... просто нужно, чтобы он был полной страницей, не скрывал переполнение и не отображал горизонтальную полосу прокрутки браузера.

Есть предложения?

ОБНОВЛЕНИЕ: Ниже приведен пример того, что я пытаюсь получить. По сути, это два шага. CSS и JS. Первый шаг, css, я ищу горизонтальную прокрутку страницы div без фиксированной высоты. Второй шаг, js, я хочу, чтобы div скользил как слайдер jQuery Coda.

альтернативный текст http://i43.tinypic.com/a1ocxj.jpg

1 Ответ

1 голос
/ 14 мая 2010

Я до сих пор не знаю, полностью ли я понимаю. Некоторый код был бы хорош.

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

Если это так, просто установите overflow-x в значение hidden для вашего тега body или любого другого тега контейнера, который имеет ту же ширину, что и окно.

(За исключением каких-то причин, вы не хотите скрывать.) 

           // If your content is in a container that is sized to the width
body {     //    of the body, then use that instead.
    clip: auto;
    overflow-x: hidden;
}

ОБНОВЛЕНИЕ: (с информацией из повторной публикации)

стиль: 

body {
            clip: auto;
            overflow-x: hidden;
        }

     /* Positioning *
        #container { width: 2500px; }
        .block { float: left; }

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

HTML: 

<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>
...