Пятница, 20.07.2018, 19:36 Вы вошли как Гость | Группа "Гость" | RSS
 

 
Главная | Форум | Чат | Информация для пользователей
[Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » Веб-мастеру » Скрипты для UCOZ » Увеличение картинки при клике для вида новостей
Увеличение картинки при клике для вида новостей
Grinya Дата: Суббота, 16.10.2010, 19:42 | Сообщение # 1
Легендарный
Группа: Администратор
Сообщений: 434
Статус: Offline
.: Дополнительные данные :.
Бог сайта и форума За хорошую посещаемость на форуме За супер посещаемость За Легендарныйа
Увеличение картинки при клике для вида новостей

Скрипт увеличения изображения при клике на него для вида новостей сайта или каталога файлов для сайтов UCOZ.

Также этот скрипт можно использовать для отдельных изображений на любых сайтах (не только на базе UCOZ).
За основу скрипта взят скрипт lytebox.js и немного переделан.
Что нового:
- убраны множество стилей(т.к. это легко настраивается в файле .css под себя)
- большие картинки при клике принимают размеры по отношнию к размерам окна браузера(как и было),а маленькие увеличиваются по отношнию к размерам окна браузера(раньше принимали истинный размер)
- убраны кнопки панели навигации и кнопка CLOSE (окно закрывается по клику на изображение или в любую точку окна браузера(раньше при клике на изображение не закрывалось))
Протестировано в:
* Firefox: Firefox: 3.6
* Internet Explorer: 8.0 (работает несколько медленнее по понятным причинам)
* Opera: 9.64
* Safari: 4.0
* Google Chrome

Порядок установки:

1. Для начала скачиваем архив и содержимое (1 файл .js ,1 файл .css , 1 изображение .gif) заливаем в корень своего сайта
с помощью Файлового менеджера в заранее созданную папку zoom.

Скачать архив

2. После этого заходим в ПУ ,Управление дизайном ,Новости сайта,Вид материалов и в самом верху кода добавляем это:

Code
<style type="text/css">  
.pul img {width:1px;}  
.pul img {height:1px;}  
.doll img {max-height:300px;}  
.doll img {max-width:300px;  
   width:expression(document.body.clientWidth > 550? "250px": "auto"); }  
</style>  
<script type="text/javascript" language="javascript" src="/zoom/lytebox.js"></script>  
<link rel="stylesheet" href="/zoom/lytebox.css" type="text/css" media="screen" />

3. После этого здесь же заменяем:

Code
$MESSAGE$

на

Code
<div align="center" class="doll"><a href="$IMG_URL1$" rel="lytebox" title="$TITLE$"><img alt="" src="$IMG_URL1$" align="center" border="0"></a></div><div class="pul">  $MESSAGE$</div>

4. Если же вы используете в качестве хранения изображений какой-нибудь хостинг, то

Code
$IMG_URL1$

нужно заменить на

Code
$OTHER...ваш номер поля...$

предварительно в настройках модуля активировав это поле для url изображения и назвав,к примеру ,,URL картинки,,

5. Если Вы не используете на своем сайте отображение изображения в виде новостей,то можно проделать всё вышесказанное для Страницы материала и комментариев к нему.

Вот и всё,после этих установок можно в поле Краткое содержание не добавлять ссылку на изображение(оно добавится само посредством вышеуказанного кода),а если вы это и сделаете,то ничего страшного - оно будет переведено в однопиксельную невидимую точку (для чего и прописан стиль ,,pul,, (стиль для уже существующих новостей на сайте)).

6. Для отдельных изображений все гораздо проще:

Code
<script type="text/javascript" language="javascript" src="/zoom/lytebox.js"></script>  
<link rel="stylesheet" href="/zoom/lytebox.css" type="text/css" media="screen" /><a href="...ссылка на изображение..." rel="lytebox" title="Подпись"><img alt="" src="...ссылка на изображение..." align="center" height="...размер изображения..." border="0"></a>

Копирование и распространение материала запрещено без указания источника!
Источник: http://7x.at.ua/

Прикрепления: 7897081.jpg(25.5 Kb)


Форум » Веб-мастеру » Скрипты для UCOZ » Увеличение картинки при клике для вида новостей
  • Страница 1 из 1
  • 1
Поиск:
Статистика Форума
Последнии темы Читаемые темы Лучшие пользователи Новые пользователи
  • Какие хорошие комедии вы видели? (6)
  • 200Грн за комментарий (0)
  • Реклама на www.7x.net.ua (1)
  • Как давать заявки? (2)
  • Сектор Газа-Концерт в Санкт-Петербурге (1992, Презентация ал (0)
  • Вакансии по раздерам (1)
  • Приглашаем! Журналистов, Риперов... (0)
  • Как качать с "www.7x.net.ua" бесплатно (0)
  • Правообладателям (0)
  • Партнерская программа от www.7x.net.ua (3)
  • Я был ТУТ! (18)
  • Как вы относитесь к сериалу Звёздные врата: SG-1 (17)
  • Фото приколы. (16)
  • Песни о Афгане и Чечне (15)
  • Конкурс на лучший баннер (11)
  • Видео приколы. (11)
  • Розыгрыши (11)
  • Красивый шаблон для системы uCoz (10)
  • Под Бутиратом (9)
  • Алкаши (9)
  • Grinya
  • A1rBoRnE
  • Chibcha
  • DarkSpirit
  • Змей
  • Fantom
  • Borman
  • Worlak
  • Mister_Coob
  • Anatoliy
  • tatiana2NittrorDriedy
  • inna_aqol
  • MerrillCargy
  • Bogdanndi
  • Malinafange
  • Gregorsep
  • Bogdanxdy
  • sellspint
  • SvetaRogova_1995
  • Vlasova_1975
  • ()


    www.7x.net.ua © 2018 Хостинг от uCoz