Выезжающая панелька на CSS3
9 из 10
Проголосовало: 2
На вашем сайте нет места для какого-нибудь элемента или просто хочется чего-нибудь нового? Тогда этот скрипт "Выезжающая панелька на CSS3" вам подходит.
В основном все используют для выезжающей панели код jQuery, но мы будем использовать только HTML и только CSS3.
Так будет выглядеть HTML код:
Код
<div class="web-deva">
<img src="Feed.png" alt="Отправить отзыв" width="64" />
<div class="web-deva_vnutr">
>> Здесь ваша информация <<
</div>
</div>
И CSS:
Код
.web-deva {
background: #fd9f13; /* фон кнопки */
position: fixed;
top: 20%; /* отступ от верха */
left: 0;
width: 65px; /* ширина кнопки */
padding: 12px 0;
text-align: center;
color: #ffffff;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-border-radius: 0 5px 5px 0;
-moz-border-radius: 0 5px 5px 0;
border-radius: 0 5px 5px 0;
}
.web-deva_vnutr {
position: fixed;
top: 20%;
left: -400px;
background: #fd9f13; /* фон панельки */
width: 370px; /* ширина панельки */
height: 110px; /* высота панельки */
padding: 15px;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
text-align: left;
/* круглые углы */
-webkit-border-radius: 0 0 5px 0;
-moz-border-radius: 0 0 5px 0;
border-radius: 0 0 5px 0;
}
.web-deva:hover {
left: 400px;
}
.web-deva:hover .web-deva_vnutr {
left: 0;
}
Вы можете изменить цвет под свой сайт, а также изменить ширину и высоту панельки.
Всего доброго!
Автор публикации: Загрузка
Загрузка
Источник: http://web-deva.net/
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация |
Вход
Это моя работа, которая велась давольно таки давно

Времени было мало, поэтому я скачал полностью все, что было и сделал архив

111 мегабайт? wtf? Что в архив напихали?
Левое меню это BLG. Возможны какие-то баги, но в целом все должно работать корректно!
?
/* Скрывает каперайт ucoz */
.banner_u {
opacity:0.2 ;
}
/* ----------------- */
opacity:0.1 ; это легальное скрытее $POWERED_BY$
ставим в ccs не ставте 0.0 тоже за банят 1.1 можно сам пользуюсь.
10:24
Ответов:
1 Написал:
maliha2750 Дата:
07.02.2026 14:39
Ответов:
3 Написал:
a73669617 Дата:
16.01.2026 14:37
Ответов:
6 Написал:
a73669617 Дата:
16.01.2026 13:10
Ответов:
2 Написал:
a73669617 Дата:
16.01.2026 11:39
Ответов:
1603 Написал:
AdminSB Дата:
14.09.2022 19:37
Ответов:
23 Написал:
arman02151 Дата:
27.04.2021
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Для проверки введите адрес сайта в форму ниже: