Делаем слайдер с помощью jquery - PullRequest
Новая
       48

Делаем слайдер с помощью jquery

2 голосов
/ 09 января 2012

Example

Мне нужен слайдер, который состоит из трех групп с 3 слайдерами внутри.Он начнет скользить по первой группе (1-2-3) и после показа второй группы ... циклически все.Ползунок должен остановиться при наведении мыши и показать статью, а группы будут отображаться при нажатии.Кто-нибудь может предложить такой слайдер?

Спасибо

Ответы [ 2 ]

0 голосов
/ 09 января 2012

Это очень специфический вид слайдера, который вы ищете, поэтому я думаю, что вы должны сделать кодирование самостоятельно.

Я бы предложил использовать слайдер, например EasySlider (базовый, сложный или сложный материал) или SudoSlider (больше возможностей, крутая кривая обучения), чтобы сделать скольжение.Оба поддерживают вложенные ползунки.

Затем создайте все элементы управления самостоятельно и привяжите их к некоторому коду jQuery для обработки логики скольжения (логика скольжения вызывает ползунки).Этот же код, конечно, должен обрабатывать «автоматическое скольжение».

При создании автоматического скольжения я составил бы список всех «шагов», которые будет выполнять код, например: {{1,1}, {1,2}, {1,3},{2,1}, {2,1}, {2,2}, {2,3} ...}, чтобы сообщать сценарию, что он должен делать каждые X секунд.

Надеюсь, выможно заставить его работать.

0 голосов
/ 09 января 2012

вы можете создать для этого какой-то обработчик, как в jquery lib:

функция js: 

function screenThis(page){
$('#screen').hide("fast");
$('#screen').load("handler.php?p="+page).show();
//you can add some effects on this fcn
}

handler.php может быть таким: 

<?php
$page = @$_GET["p"];
$content = ''; //init
$q = mysql_query("select * from pages where id = '$page' ");
while($r = mysql_fetch_array($q)){
$content = $r['content'];
}
if ($content != '') echo $content;
?>

и HTML-код для вашего меню может быть таким: 

<a href="#" onclick="screenThis(somenumber/orpageid)">Article 1</a>
<a href="#" onclick="screenThis(somenumber/orpageid)">Article 2</a>
<a href="#" onclick="screenThis(somenumber/orpageid)">Article 3</a>
...