Как прикрутить галерею iload на форум и модули, $IMAGE1$
|
|
[1] likbezz [26.04.2012, 01:52] |
Спрашивает Оленька2116: Quote (Оленька2116) скажите как же сделать так как на этом сайте ... картинки загруженные в новости выходят в модальном окне iLoad Это реально важный вопрос! Что такое скрипт http://studioad.ru/iload/iLoad.js я знаю!!! Мне нужен код как прикрутить его к загружаемым фоткам в новостях.
|
|
[2] likbezz [26.04.2012, 01:55] |
Вообще, библиотека сама может икать и обрабатывать ссылки помеченные соответствующим образом. Делается это при помощи атрибута «rel». Так что, если вы добавляете изображения через шаблон, и нужно что бы они открывались в iLoad делаем вот так: Это в шаблонах «Вид материала» и «Материал и комментарии к нему»: Code <?if($IMG_URL1$)?> <a rel="iLoad" href="$IMG_URL1$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL1$)?>$IMG_SMALL_URL1$<?else?>$IMG_URL1$<?endif?>" style="width:100px;height:auto;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?> - Таких блоков может быть несколько. По теме: Как вывести все картинки из прикрепления? (Вывести картинки из прикрепления на форуме, и в пр. модулях.)
И так, если вы юзаете картинки через шаблон, то вам все должно быть понятно. ....
А как же прикрутить обработчик iLoad к картинкам что вставляются оператором $IMАGE1$ ? Тоже не очень сложно.
Инструкция. Качаем библиотеку, и подключаем её, либо ко всему сайту, либо только к тем шаблонам, де должна работать. Подключается она, в самый низ. Если ко всему сайту - то добавляем ссылку на скрипт в любой глобальный блок, что отображается на сайте, например в нижний. Code <script type="text/javascript" src="http://likbezz.ru/_source/_js/iload/iLoad.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("div.eMessage a[title^='Нажмите'],td.eText a[title^='Нажмите'],td.posttdMessage a[title^='Нажмите']").click(function(){ L([this.href],this.title);return false; }); }); </script> Где: Code $("div.eMessage a[title^='Нажмите'],td.eText a[title^='Нажмите'],td.posttdMessage a[title^='Нажмите']") - набор стандартных классов блоков в которых могут быть изображения.
Если у вас НЕ стандартный шаблон, данный скрипт обработчика может не работать. В таком случае, смотрите какой класс отвечает за блок в котором текст и и картинка и корректируете скрипт обработчика.
Данный обработчик работает с форумом, новостями и каталогами. ...
Пример работы данного скрипта можно посмотреть на сайте разработчика: studioad.ru или в ниже представленных примерах.
☑ Пример №1 - через шаблон.
☑ Пример №2 - обрабатываются картинки с title начинаюшимся со слова «Нажмите» ...
По теме: Последняя (на данный момент) версия iLoad v3.3.5 Подробнее о API галереи iload |
|
[3] RazieL [04.05.2012, 11:38] |
likbezz, сам пользуюсь этой галереей, очень нравится, работает быстро и легко подключается... Только вот у меня вопрос. Я при подключении прописывал только Code <script type="text/javascript" src=".../iload/iLoad.js"></script> Для чего служит остальная часть? Code <script type="text/javascript"> $(document).ready(function(){ $("div.eMessage a[title^='Нажмите'],td.eText a[title^='Нажмите'],td.posttdMessage a[title^='Нажмите']").click(function(){ L([this.href],this.title);return false; }); }); </script> |
|
[4] likbezz [04.05.2012, 11:56] |
RazieL, Quote (RazieL) Для чего служит остальная часть? Находить все ссылки с картинками - с титле начинающимся на «Нажмите» и вешает обработчик, для того что бы открывались в галерее. ... |
|
[5] RazieL [04.05.2012, 12:20] |
likbezz, да, но у меня ведь и без него работает) |
|
[6] likbezz [04.05.2012, 15:00] |
RazieL, Quote (RazieL) да, но у меня ведь и без него работает) Значит тебя прописан к ссылкам rel="iLoad" Code <a rel="iLoad" href="$IMG_URL1$" title="$TITLE$"> картинка </a> или в самой библиотеке уже есть скрипт обработчик. ... |
|
[7] fart [12.05.2012, 23:23] |
а как сделать обработчик чтобы он открывал группу изображений, ну т.е чтобы все изображения в материала он объединил в 1 группу и их можно было пролистывать! |
|
[8] likbezz [13.05.2012, 02:21] |
fart, Quote (fart) а как сделать обработчик чтобы он открывал группу изображений, ну т.е чтобы все изображения в материала он объединил в 1 группу и их можно было пролистывать! Повесить скрипт на блок текста с картинками, который искал бы ссылки на картинки, и добавлял бы соответствующий атрибут. Типа: Code <script type="text/javascript"> $(document).ready(function(){ $("div.eMessage a[title^='Нажмите'],td.eText a[title^='Нажмите'],td.posttdMessage a[title^='Нажмите']").attr('rel','iLoad|Название сета'); L.create(); }); </script> ...
☑ Пример №2_Group - обрабатываются картинки с title начинаюшимся со слова «Нажмите» и добавляет атрибут rel с названием сета. ... |
|
[9] fart [13.05.2012, 12:20] |
likbezz, Спасибо! |
|
[10] QQQ [17.05.2012, 10:06] |
Здравствуйте likbezz! У меня такая проблема: установил на свой сайт (ucoz) данный скрипт, и всё вроде работает но, открывается сразу 2 изображения.в чём может быть проблема? P.S. Если нужно дам ссылку на сайт.Заранее спасибо!
Сообщение отредактировал QQQ - Четверг, 17.05.2012, 10:12 |
|
[11] likbezz [17.05.2012, 10:19] |
QQQ, Quote (QQQ) У меня такая проблема: установил на свой сайт (ucoz) данный скрипт, и всё вроде работает но, открывается сразу 2 изображения.в чём может быть проблема? Добрый. Прописан два раза. Или прописан и атрибут rel и открытие по клику - нужно что-то одно.
Quote (QQQ) Если нужно дам ссылку на сайт Конечно нужно. |
|
[12] QQQ [17.05.2012, 12:07] |
Спасибо за быстрый ответ! Вот сайт: клик! Вот код скрипта: <center> <?if($IMG_URL2$)?><a rel="iLoad" href="$IMG_URL2$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL2$)?>$IMG_SMALL_URL2$<?else?>$IMG_URL2$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?> <?if($IMG_URL3$)?><a rel="iLoad" href="$IMG_URL3$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL3$)?>$IMG_SMALL_URL3$<?else?>$IMG_URL3$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?> <?if($IMG_URL4$)?><a rel="iLoad" href="$IMG_URL4$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL4$)?>$IMG_SMALL_URL4$<?else?>$IMG_URL4$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?> <?if($IMG_URL5$)?><a rel="iLoad" href="$IMG_URL5$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL5$)?>$IMG_SMALL_URL5$<?else?>$IMG_URL5$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?></center> Quote (likbezz) Прописан два раза. Или прописан и атрибут rel и открытие по клику - нужно что-то одно.
А где это можно посмотреть?Добавлено (17.05.2012, 12:07) ---------------------------------------------
Quote (QQQ) Спасибо за быстрый ответ! Вот сайт: клик! Вот код скрипта: <center> <?if($IMG_URL2$)?><a rel="iLoad" href="$IMG_URL2$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL2$)?>$IMG_SMALL_URL2$<?else?>$IMG_URL2$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?> <?if($IMG_URL3$)?><a rel="iLoad" href="$IMG_URL3$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL3$)?>$IMG_SMALL_URL3$<?else?>$IMG_URL3$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?> <?if($IMG_URL4$)?><a rel="iLoad" href="$IMG_URL4$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL4$)?>$IMG_SMALL_URL4$<?else?>$IMG_URL4$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?> <?if($IMG_URL5$)?><a rel="iLoad" href="$IMG_URL5$" title="$TITLE$"><img src="<?if($IMG_SMALL_URL5$)?>$IMG_SMALL_URL5$<?else?>$IMG_URL5$<?endif?>" style="width:100px;height:75px;border:0;" alt="Картинка к материалу: «$TITLE$»" /></a> <?endif?></center> Quote (likbezz) Прописан два раза. Или прописан и атрибут rel и открытие по клику - нужно что-то одно.
А где это можно посмотреть?
Странно но, я сам нашёл ответ - просто переложил файлы из корня сайта в созданную папку "iload" и всё заработало! Спасибо за помощь и за скрипт!
Сообщение отредактировал QQQ - Четверг, 17.05.2012, 10:47 |
|
[13] likbezz [17.05.2012, 12:47] |
QQQ, Quote (QQQ) Странно но, я сам нашёл ответ - просто переложил файлы из корня сайта в созданную папку "iload" и всё заработало! И тем не менее, поправь. У тебя скрипт прописан два раза. Один раз вот здесь: Code <script type='text/javascript' src='/iload/iLoad.js'></script><!--/U1MENU1Z--> - В глоб блоке MENU А второй раз в самом низу страницы: Code <script type='text/javascript' src='/iLoad/iLoad.js'></script> </body> - Убери один из них. ... |
|
[14] QQQ [17.05.2012, 13:17] |
Всё исправил!=) У меня ещё один вопрос: я решил сделать так: Code <center> <a href='$IMG_URL2$' rel='iLoad|Изображение к материалу' title='Нажмите левую кнопку мыши на изображении и не отпуская кнопку переместите мышку.'><img src='$IMG_SMALL_URL2$'/></a> <a href='$IMG_URL3$' rel='iLoad|Изображение к материалу' title='Нажмите левую кнопку мыши на изображении и не отпуская кнопку переместите мышку.'><img src='$IMG_SMALL_URL3$'/></a> <a href='$IMG_URL4$' rel='iLoad|Изображение к материалу' title='Нажмите левую кнопку мыши на изображении и не отпуская кнопку переместите мышку.'><img src='$IMG_SMALL_URL4$'/></a> <a href='$IMG_URL5$' rel='iLoad|Изображение к материалу' title='Нажмите левую кнопку мыши на изображении и не отпуская кнопку переместите мышку.'><img src='$IMG_SMALL_URL5$'/></a> </center> как сделать чтоб предпросмотр (т.е. уменьшенные изображения) были 100px на 100px?
Сообщение отредактировал QQQ - Четверг, 17.05.2012, 13:31 |
|
[15] likbezz [17.05.2012, 13:48] |
QQQ, Quote (QQQ) как сделать чтоб предпросмотр (т.е. уменьшенные изображения) были 100px на 100px? Прописать им размер ) Типа: Code <img src="$IMG_SMALL_URL4$" style="width:100px;height:100px;" alt=""/> |
|