Помощник
|
Создание фотогалереи |
Гость_0_*
Гость_0_* |
Сообщение
#1
|
||
|
|
||
|
|||
ZiTosS |
4.4.2009, 15:15;
Ответить: ZiTosS
Сообщение
#2
|
|
фотогалерея на JavaScript
Уже обсуждалось Скачайте из аттача предложенную галерею. Как её установить и ей пользоваться щас распишу: Распакуйте архив, который вы скачали в отдельную папку. Структура папок и файлов такова: gallery/ - папка самой галереи, где будут располагаться файл альбомов и наши картинки gallery/Madeira/ - наш альбом gallery/Madeira/images/ - Большие картинки(просмотр) gallery/Madeira/thumbnails/ - Малые картинки(предпросмотр) Файлы в папках images и thumbnails должны быть с идентичным(одинаковым) названием gallery/Madeira/gallery.xml - файл, который определяет, какие картинки будут показаны в данной галереи -------------------------------------------------------------------------------------------------------------------------------- scripts/ - системные скрипты для работы с библиотекой(их не трогать) -------------------------------------------------------------------------------------------------------------------------------- styles/ - папка оформления styles/imago.css - файл каскадных таблиц(оформление страницы и блоков) styles/img/ - папка картинок(пусто, предыдущая, следующая, загрузка) И так смотрим в файл index.html 1) Нам нужно вставить системные файлы, поэтому между <head> и </head> вставляем <script src="scripts/mootools.v1.11.js" type="text/javascript"></script> <script src="scripts/imago.js" type="text/javascript"></script> 2) Встречаем такой HTML код, это и есть создание альбома <div id="imagogallery" class="imagogallery" > this.loader = new GalleryLoader('gallery.xml', 'gallery', "Madeira"); this.prefetching = 'all'; </div> Нам существены только две строкчки, которые нужно понять и разобрать this.loader = new GalleryLoader('gallery.xml', 'gallery', "Madeira"); this.prefetching = 'all'; Вторая строка нужна обязательно, для вывода альбома Первая строка это генератор фотогалереи, как мы видим там есть 3 параметра: 1) Файл, который определяет, какие картинки будут показаны в данной галереи (в данном примере gallery.xml) 2) Папка относительно index.html, где хранятся альбомы (в данном примере gallery) 3) Папка альбома в папке gallery(так же будет и называться альбом) (в данном примере Madeira) Так вот, чтобы теперь создать новый альбом, нам нужно создать в gallery/ подобие папки Madeira со своими картинками в папках images и thumbnails и своим XML-файлом. Всё мы создали альбом USA с файлом usa.xml Теперь в HTML мы можем сгенерировать галлерею таким образом <div id="imagogallery" class="imagogallery" > this.loader = new GalleryLoader('usa.xml', 'gallery', "USA"); this.prefetching = 'all'; </div> Всё наша галерея работает Как же нам теперь добавлять файлы в определённый альбом. Для этого и служит файл *.xml Если открыть его в блокноте мы можем увидеть строку, определяющую XML файл, нам она не важна <?xml version="1.0" encoding="UTF-8"?> Так же мы видим тег simpleviewerGallery, его параметры настройки галереи(цвета текста, откуда считывать предпросмотр и сами картинки, размеры окна и так далее) Внутри этого тега и располагается представление картинки <image> <filename>[название_картинки_с_расширением]</filename> <caption>[заголовок_к_картинке]</caption> </image> Вставляя такие последовательности друг за другом мы формируем список показываемых картинок в данном альбоме Удачно разобраться, будут вопросы пишите, на все отвечу
Прикрепленные файлы
|
|
|
Милена_mw |
27.5.2009, 9:11;
Ответить: Милена_mw
Сообщение
#3
|
|
Здравствуйте! Подскажите, пожалуйста, а можно ли реализовать внизу галереи к каждой фото "Комментарии" и если можно, то как?
|
|
|
ZiTosS |
28.5.2009, 1:16;
Ответить: ZiTosS
Сообщение
#4
|
|
Просто так не получится. Там не мало придётся перелопатить, но сделать можно
|
|
|
Drev |
28.5.2009, 14:21;
Ответить: Drev
Сообщение
#5
|
|
Спасибо большое. Помогло.
Цвет и границы я в css файле поменял. Но возник вопрос как изменять размер окон и расстояние между ними, и как разместить превью под (над, справа) картинкой |
|
|
m0tti |
25.8.2009, 22:14;
Ответить: m0tti
Сообщение
#6
|
|
А если отографий будет 1000 , как ява галерея работать будет?
|
|
|
strelog321 |
10.9.2009, 10:40;
Ответить: strelog321
Сообщение
#7
|
|
Добрый День! Понравилась фотогаллерея. Все поставил но не могу найти настройку размера окон. Подскажите пожалуйста в каком файле и теге это находится. СПАСИБО!!!
|
|
|
ZiTosS |
13.9.2009, 0:01;
Ответить: ZiTosS
Сообщение
#8
|
|
m0tti, попробуй и узнаешь, не пробовал не знаю...
strelog321, про какой размер окон вы говорите, я понять не могу... |
|
|
didou |
13.11.2009, 23:16;
Ответить: didou
Сообщение
#9
|
|
прошу прощения за тупой вопрос, но как такую галерею вставить на сайт на хостинге narod.ru
|
|
|
ZiTosS |
16.11.2009, 1:19;
Ответить: ZiTosS
Сообщение
#10
|
|
didou, всё легко и просто так же как и на любой другой. Ограничений на использование галереи нет, так что стоит просто почитать как вставлять Javascript на свой сайт
|
|
|
|
Похожие темы
Тема | Ответов | Автор | Просмотров | Последний ответ | |
---|---|---|---|---|---|
как заслужить право на создание новой темы? | 7 | writer80 | 2207 | 12.3.2024, 22:54 автор: Lumex |
|
<Braga/> Создание Telegram-ботов, web-приложений, крипто-бирж, сайтов. | 2 | newbraga | 1773 | 10.3.2024, 22:04 автор: newbraga |
|
СОЗДАНИЕ : / САЙтЫ / ЛЕНДЫ / БОТЫ ТГ / ВАЙТЫ / КРЕО / СОФТЫ / ДИЗАЙН [PHP, JS, HTML/CSS] и другое | 5 | CULA | 3397 | 19.12.2023, 18:55 автор: CULA |
|
Создание и ведение аккаунтов в соцсетях ("В контакте"/Telegram) Услуги от профессионального журналиста и SMM-менеджера |
2 | AvtorXXX | 1706 | 13.11.2023, 23:47 автор: AvtorXXX |
|
Создание информационной площадки с доской объявлений | 1 | xweb | 2061 | 16.1.2023, 16:25 автор: xweb |
Текстовая версия | Сейчас: 19.4.2024, 6:17 |