Страница 1 из 11
Форум про uCoz » Раздел uCoz » Скрипты и коды uCoz » Скрипт увеличения изображения для uCoz
Скрипт увеличения изображения для uCoz
Kosten
Дата: Воскресенье, 04.10.2015, 22:21 | Сообщение # 1
Администраторы
Сообщений:12658
Награды: 38


Скрипт который увеличивает любые изображение на сайте вы возможно видели на многих площадках. И вот я решил выложить один замечательный Скрипт увеличения изображения для uCoz если честно я как то и не задумывался о нём но многие его ищут и хотят установить себе на сайт. Данный скрипт есть в интернете во многих вариантах и это один из них и думаю я постепенно для вас выложу ещё варианты.



Так вот я нашёл его и убрал немного лишнего и сторонние ссылки , но не беспокойтесь он остался так же работоспособным.
Ну теперь давайте установим его !
Для установки в первую очередь скачайте архив с нашего сайта и распакуйте его, затем загрузите папку highslide в корень вашего сайта (Файловый менеджер) корень.
Следующим шагом мы установим скрипт в верхнюю часть сайта:

Код
<script type="text/javascript" src="/highslide/highslide.js"></script>
<link rel="stylesheet" type="text/css" href="/highslide/highslide.css" />
<script type="text/javascript">
// override Highslide settings here
// instead of editing the highslide.js file
hs.graphicsDir = '/highslide/graphics/';
</script>


Затем нам остаётся настроить само изображения и для этого вам нужно пройти в вид материала того модуля где у вас выводится изображения и находим тот код который выводит у вас изображения .

Обычно это выглядит примерно так:

Код
<img src="$IMG_URL1$" width="460" height="200" alt="" />


И нам его всего лишь нужно подредактировать а точнее добавить ссылку для увеличения .
И делается это вот так :

Код
<a href="$IMG_URL1$" class="highslide" onclick="return hs.expand(this)"> <img src="$IMG_URL1$" width="460" height="200" alt="" /></a>


И теперь при наведение на картинку у вас появится значок Zoom и вы можете увеличивать изображения клика по изображению и так же уменьшать его.
Прикрепления: 8253223.jpg(28Kb)


ZruBkul
Дата: Пятница, 16.10.2015, 17:37 | Сообщение # 2
Пользователи
Сообщений:29
Награды: 0


Старо и актуально.
Kosten
Дата: Пятница, 16.10.2015, 18:22 | Сообщение # 3
Администраторы
Сообщений:12658
Награды: 38


Цитата ZruBkul ()
Старо и актуально.

Не удивительно, так как нового нет.


Brung
Дата: Пятница, 16.10.2015, 19:00 | Сообщение # 4
Пользователи
Сообщений:104
Награды: 0


А вы что не знаете, что он еще и настраивается, возможно этот уже настроен, а так нужно его и подводить по дизайну, делать светлое к примеру окно, где будет увеличение или темное.
Kosten
Дата: Пятница, 16.10.2015, 19:05 | Сообщение # 5
Администраторы
Сообщений:12658
Награды: 38


Brung, уже есть настроен, он подходит на светлый и на темный дизайн, и можете посмотреть здесь он прописан.

Прикрепления: 4596148.jpg(15Kb)


Brung
Дата: Пятница, 16.10.2015, 19:08 | Сообщение # 6
Пользователи
Сообщений:104
Награды: 0


Kosten, классно сделан, и видно что рекламы нет.
Kosten
Дата: Пятница, 16.10.2015, 19:10 | Сообщение # 7
Администраторы
Сообщений:12658
Награды: 38


Brung, точно не скажу, кто делал, возможно ЛехаРусс, так как с его сайта брал. А на счет рекламы, вообще не понимаю, зачем ее ставить. Это для того, чтоб пользователь скачал и установил скрипт, а потом искал эту ссылку чтоб убрать, нет это не мое.

Brung
Дата: Пятница, 16.10.2015, 19:12 | Сообщение # 8
Пользователи
Сообщений:104
Награды: 0


Потом попробую установить, там же есть эффект затемнение.
Kosten
Дата: Пятница, 16.10.2015, 19:14 | Сообщение # 9
Администраторы
Сообщений:12658
Награды: 38


Brung, да есть и не хило смориться, чисто изображение на темном оттенке, просто визуализация меняется на раз лучше.

Brung
Дата: Пятница, 16.10.2015, 19:15 | Сообщение # 10
Пользователи
Сообщений:104
Награды: 0


Спасибо, все понятно.
danshin95
Дата: Четверг, 21.04.2016, 15:06 | Сообщение # 11
Пользователи
Сообщений:1
Награды: 0


а как скачать то
Kosten
Дата: Четверг, 21.04.2016, 16:04 | Сообщение # 12
Администраторы
Сообщений:12658
Награды: 38


danshin95, если вы скачать хотите и закинуть себе в корень сайта, то вот прочтите мануал по этой теме.

А скачать вам нужно этот архив поместить файловый менкджер, 2 ссылки и третья на папку.


Kosten
Дата: Четверг, 21.04.2016, 16:12 | Сообщение # 13
Администраторы
Сообщений:12658
Награды: 38


Также можно использовать с прозрачностью фона, что сами настроите.

Код
<script type="text/javascript" src="highslide/highslide.js"></script>
<link rel="stylesheet" type="text/css" href="highslide/highslide.css" />
<script type="text/javascript">
hs.registerOverlay({
html: '<div class="closebutton" onclick="return hs.close(this)" title="Закрыть"></div>',
position: 'top right',
fade: 2  
});
hs.graphicsDir = 'highslide/graphics/';
hs.dimmingOpacity = 0.7; //прозрачность фона
hs.wrapperClassName = 'borderless';
</script>


Если решили только одну картинку изображение увеличить, это может быть в статье любой, то после все установки, можно поставить такой код.

Код
<a href="image_big.jpg" title="Увеличить" class="highslide" onclick="return hs.expand(this)">
<img alt=" " src="image_big.jpg" width="160" height="107"/></a>


workman
Дата: Четверг, 21.04.2016, 16:34 | Сообщение # 14
Vip
Сообщений:1576
Награды: 7


Как по моему так просто грузанутый JS. Зачем вешать столько много если можно по моемому можно одним?

Каждый раз, когда ты можешь помочь кому-то, просто сделай это и радуйся тому, что Бог отвечает на чьи-то молитвы через тебя...
Kosten
Дата: Четверг, 21.04.2016, 17:19 | Сообщение # 15
Администраторы
Сообщений:12658
Награды: 38


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

Форум про uCoz » Раздел uCoz » Скрипты и коды uCoz » Скрипт увеличения изображения для uCoz
Страница 1 из 11
Поиск: