Автоматическое уменьшение картинок в любом разделе сайта
|
|
workman | Воскресенье, 10 Августа 2014, 13:23 | Сообщение 1 |
| Автоматическое уменьшение картинок в любом разделе сайта, где существует тег - $MESSAGE$ Данный скрипт будет просто незаменим для большинства администраторов сайтов, так как он превратит все изображения, которые превышают по высоте 200px и ширине 400pxв миниатюры, при клике по которым пользователи смогут увидеть в лайтбокс окне от uCoz их полноразмерные оригиналы
Установка: Форум — Вид материалов — Замените $MESSAGE$ на: Код <div class="apomessage">$MESSAGE$</div> В нижнюю часть CSS файла ставите это: Код .apomessage img { max-width:400px; max-height:200px; -moz-border-radius: 6px; /* закругление для старых Mozilla Firefox */ -webkit-border-radius: 6px; /* закругл. для старых Chrome и Safari */ -khtml-border-radius:6px; /* закругл. для браузера Konquerer системы Linux */ border-radius: 6px; /* закругление углов для всех, кто понимает */ } Если Вы решили поменять размеры на свои, то также не забывайте поменять их в скрипте, иначе работать не будет. Далее: Форум — Общий вид страниц форума — перед < /body> вставляйте: Код <script>$(document).ready(function(){$('.apomessage img').mouseover(function(){if(parseInt($(this).css('height'))==200||parseInt($(this).css('width'))==400){if($(this).parent('a').html()!=null ){$(this).after('<a href="'+$(this).parent('a').attr('href')+'" class="ulightbox"><img src="'+$(this).attr('src')+'"></a>');$(this).remove()}else{$(this).after('<a href="'+$(this).attr('src')+'" class="ulightbox"><img src="'+$(this).attr('src')+'"></a>');$(this).remove()}}})});</script>
Смотрим пример работы скрипта тут: http://www.talk-russia.ru/forum/9-18-1 Самое что прикольное в работе данного скрипта, так это то что он уменьшает и увеличивает картинки,которые прописывались даже с помощью ВВ кодов в виде: img.../img
| Страна: (RU) |
| |
Kosten | Воскресенье, 10 Августа 2014, 13:44 | Сообщение 2 |
| workman, это отличный код. Вот если б можно было тайтл проставлять.. цены бы не было
| Страна: (RU) |
| |
Kosten | Воскресенье, 10 Августа 2014, 13:46 | Сообщение 3 |
| workman, поздравляю.. теперь ты вип.. и подпись можешь оставить активную на сайт или картинку
| Страна: (RU) |
| |
workman | Воскресенье, 10 Августа 2014, 13:50 | Сообщение 4 |
| Цитата Kosten ( ) поздравляю.. теперь ты вип.. Спасибо!!! Я всегда знал что ДЕСАНТ своих не бросает!!!!!!!!!
| Страна: (RU) |
| |
|
workman | Воскресенье, 10 Августа 2014, 13:56 | Сообщение 6 |
| Цитата Kosten ( ) Вот если б можно было тайтл проставлять.. цены бы не было Тайл говоришь??? Ну чтож... Вот тебе тайл Код <script type="text/javascript">$('img').attr({'title': 'Нажмите для увеличения'};);</script>
| Страна: (RU) |
| |
workman | Воскресенье, 10 Августа 2014, 13:57 | Сообщение 7 |
| Спасибо!!! 5 ноября тоже с поздравлениями приду...
| Страна: (RU) |
| |
Kosten | Воскресенье, 10 Августа 2014, 14:00 | Сообщение 8 |
| Да с тайтлом шикарно для поисковиков.. 5 ноября ждемс
| Страна: (RU) |
| |
workman | Воскресенье, 10 Августа 2014, 14:06 | Сообщение 9 |
| Цитата Kosten ( ) Да с тайтлом шикарно для поисковиков.. В основном, для поисковиков полезен alt... Я тут оставлял уже данный скрипт
| Страна: (RU) |
| |
Kosten | Воскресенье, 10 Августа 2014, 14:11 | Сообщение 10 |
| В меню сайта интересно можно прописать alt ? Прописать то можно.. но в тему будет.. основном на картинки идет.
| Страна: (RU) |
| |
workman | Воскресенье, 10 Августа 2014, 14:16 | Сообщение 11 |
| Цитата Kosten ( ) В меню сайта интересно можно прописать alt ? Я на своих сайтах прописал везде в основном
| Страна: (RU) |
| |
Kosten | Воскресенье, 10 Августа 2014, 14:26 | Сообщение 12 |
| workman, сенкью вери мач.. тоже надо прописать ключи думаю лишним не будет.
| Страна: (RU) |
| |
workman | Воскресенье, 10 Августа 2014, 15:09 | Сообщение 13 |
| Изменил код. В него добавил title. Код <!-- Уменьшение картинки --> <script>$(document).ready(function(){$('.apomessage img').mouseover(function(){if(parseInt($(this).css('height'))==200||parseInt($(this).css('width'))==400){if($(this).parent('a').html()!=null ){$(this).after('<a href="'+$(this).parent('a').attr('href')+'" class="ulightbox"><img src="'+$(this).attr('src')+'" title="Нажмите для увеличения картинки"></a>');$(this).remove()}else{$(this).after('<a href="'+$(this).attr('src')+'" class="ulightbox"><img src="'+$(this).attr('src')+'" title="Нажмите для увеличения картинки"></a>');$(this).remove()}}})});</script> <!-- /Уменьшение картинки -->
| Страна: (RU) |
| |