Красивый эффект на картинку на чистом CSS3 | |
| Это стильно сделанный эффект на картинки при помощи CSS3. Где при наведение курсора он появляется, что можно сделать на своем сайте. Это может быть как отдельная страница и там выставить Avatav пользователей, когда наведете, то появится его логин или ник, все это от вас зависит. какой оператор поставите. Также сами можете придумать, где его использовать. возможно вид материала и комментариев на главном изображение. По умолчанию сделано в форме круга, так как там идет полоса, а потом за ней темно прозрачная форма появляется. Но все можно посмотреть на предоставленной демонстраций, где понять по материалу и его применение. Приступаем к установке: 1. Скачиваем файл и потом что в нем находится, то делаем файловом менеджере папку css и все туда закидываем. 2. Находим нужную странице на портале и только после < /head > устанавливаем. Код <link rel="stylesheet" type="text/css" href="/css/ohover.css"/> 3. Остается установить скрипт на оформление картинки, что идет со стильным эффектом. Код <div class="example"> <div class="row"> <div class="row-2"> <div class="item-hover circle effect1"><a href="#"> <div class="spinner"></div> <div class="img"><img alt="img" src= "Ссылка на картинку"></div> <div class="info"> <div class="info-back"> <h3>Заголовок</h3> <p>Описание</p> </div> </div> </a></div> </div> Здесь пишем заголовок, или как уже было сказано, можно поставить оператор, и можно кратко описать его. Посматриваем DEMO на материал. PS - Здесь сразу нужно понимать, что на участок class="item-hover circle effect1" - это номер эффекта, что можно выставлять, то количество, сколько нужно. | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 7 | |
|
| |
