Поставить код для плавного увеличения изображения на Блогспот несложно.Да и визуальный эффект от плавного увеличения картинок при наведении курсора мышки может привлечь посетителя и подтолкнуть его к определённым действиям.Для Блогер идею этой занимательной штучки можно реализовать всего лишь вставив небольшой НТМЛ-код,который будет отвечать за увеличение всех картинок на блоге.
Код для плавного увеличения изображений
| Для того что бы как то привлечь посетителей к своим рекламным баннерам расположенным на странице каждый извращается как может.Кто-то просто без фантазии пишет рядом жалобные просьбы кликнуть по рекламе,другие крупными буквами пишут слово ЖМИ,как будто это сможет привлечь внимание.Но ладно суть не в этом.Сама идея скрипта не моя,а взята с другого блога блогодел,но простота установки и настройки увеличения картинок,которая вообще отсутствует,привлекла моё внимание. У меня давно было желание установить не что подобное на другом блоге, но все попытки реализации задуманного заканчивались практически не начинаясь. А здесь мне попалось решение проблемы плавного увеличения изображения,которое можно реализовать быстро и доступно для всех желающих.Не нужно никаких знаний НТМЛ и нет необходимости лезть в исходный код страницы всё решается вставкой кода, расположенного справа, в уже установленный в блоге гаджет НТМЛ и ява скрипт. Вставив и сохранив данный код вы получите у себя на блогспотовском блоге такой визуальный эффект,который оживит и приукрасит страницу. <style>.post-body img { -webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease;transition: all 0.4s ease; Как установить гаджет для выделения кода?padding: 8px; background: #ffffff; border: 1px solid #d0d0d0; -moz-box-shadow: 0 0 20px rgba(0, 0, 0, .2); -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .2); box-shadow: 0 0 20px rgba(0, 0, 0, .2); -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .post-body img:hover {-moz-transform: scale(1.1);-webkit-transform: scale(1.1);-o-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1); background: #ffffff; border: 1px solid #cccccc; text-decoration: none; text-shadow: none; -moz-box-shadow: 1em 1em 1em -0.5em rgba(0,0,6,0.5); -webkid-box-shadow: 1em 1em 1em -0.5em rgba(0,0,6,0.5); box-shadow: 1em 1em 1em -0.5em rgba(0,0,6,0.5); }</style> ©www.v-gol.ru Самые неразрешимые проблемы порой имеют самое простое решение. | ✎Новые сообщения |




Отправить комментарий