4 января 2011 в 21:29
Здравствуйте, товарищи.
Расскажу как я решил проблему с jQuery Plugin, а если точнее - то с jQuery Cycle. С помощью модуля Cycle можно сделать простой ротатор картинок в любом месте, у меня - в блоке справа.
1. С сайта Drupal.org скачал последнюю версию jQuery Plugin
2. После установки зашёл на: http://malsup.com/jquery/cycle/begin.html
3. В нужном месте разместил код
<img src="images/beach1.jpg" width="200" height="200" />
<img src="images/beach2.jpg" width="200" height="200" />
<img src="images/beach3.jpg" width="200" height="200" />
</div>
Конечно, этот код взят как пример с сайта, вместо всяких beach*.jpg прописываете свои пути к картинкам.
Для себя, чтобы можно открыть картинку, сделал так:
<a rel="shadowbox" href="/localhost/sites/default/files/images/rotator/1b.jpg"><img width="200" height="150" alt="" src="/localhost/sites/default/files/images/rotator/1s.jpg" /></a>
<a rel="shadowbox" href="/localhost/sites/default/files/images/rotator/2b.jpg"><img width="200" height="150" alt="" src="/localhost/sites/default/files/images/rotator/2s.jpg" /></a>
<a rel="shadowbox" href="/localhost/sites/default/files/images/rotator/3b.jpg"><img width="200" height="150" alt="" src="/localhost/sites/default/files/images/rotator/3s.jpg" /></a>
</div>
Комментирую свои деяния:
id="s1" - это идентификатор моей группы картинок
rel="shadowbox" - указатель для модуля shadowbox. Для подробностей, прошу посетить соответствующий раздел сайта Drupal.org
4. Этот код помещаем в файл со стилями темы:
height: 232px;
width: 232px;
padding: 0;
margin: 0;
}
.pics img {
padding: 15px;
border: 1px solid #ccc;
background-color: #eee;
width: 200px;
height: 200px;
top: 0;
left: 0
}
5. Выбираем нужный эффект. Пример расчитан на эффект - fade
6. Дальше, перед кодом в пункте 3 помещаем код:
jquery_plugin_add('cycle');
?>
Код, включает нужный плагин cycle.
7. Открываем файл page.tpl.php и между тэгами HEAD вставляем код:
$.fn.cycle.defaults.speed = 900;
$.fn.cycle.defaults.timeout = 6000;
</script>
Он отпределяет скорость "прокрутки" картинок
8. И в конце этого же файла, перед кодом:
вставляем наш:
$('#s1').cycle();</script>
Этот код и включает цикл ротации для выбранного массива фотографий, в нашем случае это - s1. Как и писал выше.
Всё. Всем приятной работы с Drupal ! 
Комментарии
В page.tpl.php нет таких тегов , как быть, просто вверх страницы вставить?
В моей теме в page.tpl.php нет такого кода:
<?php print $closure ?>Как поступить в таком случае?
1. Вставьте просто на самый вверх и попробуйте.
2. Тогда добавьте перед
</BODY>в самом конце.Юра, здравствуйте!
Подскажите, пожалуйста, я установил модуль jQuery plugins 6.x-1.10, и разместил код...
<img src="images/beach1.jpg" width="200" height="200" />
<img src="images/beach2.jpg" width="200" height="200" />
<img src="images/beach3.jpg" width="200" height="200" />
</div>
...в теле материала на главной. Повставлял остальные куски кода как вы указали, один только вопрос - я выбрал FADE, но куда его вставить?
В итоге мой сайт превратился вот в это
Подскажите, пожалуйста, что я мог сделать не так?
Здравствуйте!
jquery_plugin_add('cycle');
?>
Вот здесь надо. Только вместо cycle, пишите FADE.
Когда создаёте материал не забудьте выбрать формат ввода - PHP code.
Если его нет в списке, то включите модуль PHP filter.
« В нужном месте разместил код...»
А нужное место это какое?