• Страница 1 из 1
  • 1
Форум » Веб-разработка » HTML + CSS — коды » Уменьшение/увеличение картинки в личных сообщениях Ucoz
Уменьшение/увеличение картинки в личных сообщениях Ucoz
workman
Суббота, 26 Сентября 2015 | Сообщение 1
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
И так приступим к уроку установки.
Спросите - Зачем данное нужно? Ответ прост как 2+2=4, ну или кому как нравится. wink
Бывает так, что Вы работаете с настройками сайта и пересылаете друг другу картинки с стрелками, ноликами и другими подсказками и естественно вставляете картинку с помощью
Код
[img]....[/img]
, то данный скрипт попытается ее уменьшить до указаных размеров и при клике естественно ее увеличит до не узнаваемости.

Значит так.
Топаем в ПУ » Главная » Управление дизайном » Редактирование шаблонов » Личные сообщения(ЛС).
Находим вот такой код $BODY$ и заменяем его на такой
Код
<div class="LS img">$BODY$</div>


Потом на этой же странице спускаемся вниз и перед /body ставим это
Код
<style>.LS img {max-height:100px;max-width:200px;}</style>
<script>$(document).ready(function(){$('.LS img').mouseover(function(){if(parseInt($(this).css('height'))==100||parseInt($(this).css('width'))==200){if($(this).parent('a').html()!=null   ){$(this).after('<a href="'+$(this).parent('a').attr('href')+'" class="ulightbox"><img src="'+$(this).attr('src')+'" title="Нажмите для увеличения картинки" alt=""></a>');$(this).remove()}else{$(this).after('<a href="'+$(this).attr('src')+'" class="ulightbox"><img src="'+$(this).attr('src')+'" title="Нажмите для увеличения картинки" alt=""></a>');$(this).remove()}}})});</script>


Сохраняем страницу и радуемся тому что при размещении картинки,она автоматически уменьшится до указанных размеров а при клике по ней увеличится. Но это я уже повторяюсь.

Если желаете чтобы у вас работало данное везде, то скрипт пихаем в нижнюю часть сайта, а в материалах где находится $BODY$, $MESSAGE$, $CONTENT$, также окружаем данное дивами
Код
<div class="LS img">ваш код</div>


На этом все. Занавес. Урок окончен.


Сообщение отредактировал
workman - Суббота, 26 Сентября 2015, 23:19
Страна: (RU)
Kosten
Суббота, 26 Сентября 2015 | Сообщение 2
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
Отлично, поставил на сайт.
Страна: (RU)
Kosten
Воскресенье, 27 Сентября 2015 | Сообщение 3
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
К примеру вам отправляют картинку и она вам приходит в уменьшенном виде. При клике она увеличивается, как на сайте.

Вот пример ДО и пр НАЖАТИИ

Прикрепления: 9238299.png (363.7 Kb) · 3642243.png (45.9 Kb)


Сообщение отредактировал
workman - Воскресенье, 27 Сентября 2015, 02:15
Страна: (RU)
kos
Воскресенье, 27 Сентября 2015 | Сообщение 4
Оффлайн
Пользователи
Сообщений:71
Награды: 0
Первый раз вижу такое!)))

Добавлено (27.09.2015, 00:06)
---------------------------------------------
workman, молодец smile

Страна: (UA)
workman
Воскресенье, 27 Сентября 2015 | Сообщение 5
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
Цитата din ()
workman, молодец
wink
newrus
Страна: (RU)
kredit-oformi
Воскресенье, 27 Сентября 2015 | Сообщение 6
Оффлайн
Vip
Сообщений:1975
Награды: 5
ну это действительно нужная штука,Спасибо workman,
Страна: (RU)
workman
Воскресенье, 27 Сентября 2015 | Сообщение 7
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
kredit-oformi, Да не за что!!!
Страна: (RU)
workman
Воскресенье, 27 Сентября 2015 | Сообщение 8
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
Цитата DALMATIN ()
Как раз искал для одного дельца, теперь попробую доделать и покажу !

Только попробуй не показать biggrin
Страна: (RU)
Kosten
Воскресенье, 27 Сентября 2015 | Сообщение 9
Оффлайн
Администраторы
Сообщений:44267
Награды: 70
Можно и в комментариях, что workman, сделал на этом сайте.
Страна: (RU)
workman
Воскресенье, 27 Сентября 2015 | Сообщение 10
Оффлайн
Проверенные
Сообщений:1716
Награды: 9
Цитата Kosten ()
что workman, сделал на этом сайте.
Ну не я сделал конечно, а просто подсказал как сделать и не более
Страна: (RU)
JoniDen
Понедельник, 28 Сентября 2015 | Сообщение 11
Оффлайн
Vip
Сообщений:23
Награды: 1
Спасибо)
Страна: (KZ)
FeStemBer
Воскресенье, 04 Октября 2015 | Сообщение 12
Оффлайн
Проверенные
Сообщений:355
Награды: 1
Спасибо, хороший скрип, а то большую поставишь и разрывает дизайн.
Страна: (RU)
Форум » Веб-разработка » HTML + CSS — коды » Уменьшение/увеличение картинки в личных сообщениях Ucoz
  • Страница 1 из 1
  • 1
Поиск: