Хаки и Скрипты Next Generation CMS
irbees2008 irbees2008 Опубликовано - 3 - апреля Интерфейс
3709 - 1
  • Автор: --------------
  • Адаптировал: irbees2008
  • Уровень сложности исполнения: нужны навыки css hmlt
  • Демо:

На многих сайтах наверное видели с боку кнопочку на которую нажимаешь и выдвигается блок с информациейвот представляю вам код этого блока
Этот код в main.tpl

Код:
<div id="slideout">
<img src="img/23/text.png" alt="Задать вопрос" />
<div id="slideout_inner">
[Код формы вставляется здесь]
</div>
</div>

ну и стили в css
Код:
#slideout {
position: fixed;
top: 40px;
left: 0;
width: 35px;
padding: 12px 0;
text-align: center;
background: #6DAD53;
-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;
}
#slideout_inner {
position: fixed;
top: 40px;
left: -250px;
background: #6DAD53;
width: 200px;
padding: 25px;
height: 130px;
-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;
}
#slideout_inner textarea {
width: 190px;
height: 100px;
margin-bottom: 6px;
}
#slideout:hover {
left: 250px;
}
#slideout:hover #slideout_inner {
left: 0;
}
картинка в архиве Вы не можете скачивать файлы с нашего сайта ,рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

Можешь почитать и вот эту статейку "Стильные,аннимированные чекбоксы на CSS3"

Это тоже интересно

    {avatar}
    [profile][/profile]irbees2008[profile][/profile] 3 апреля 2013 [if-have-perm]| [edit-com][/edit-com] | [del-com][/del-com][/if-have-perm] {comment-short}[comment_full]

    читать полностью

    [/comment_full] [answer]
    --------------------
    Ответ от{name}
    {answer}[/answer] [quote]

    irbees2008');" style="cursor: pointer;">ответить[/quote]

Опрос

Ваше мнение

На каком движке ваш сайт?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйт cущecтвуeт: 4627 дней
  • Статических страниц: 10
  • Категорий: 28
  • Новостей: 618
  • Неопубликованных новостей: 8
  • Комментариев: 257
  • Зарегестрированных пользователей: 779
  • Онлайн всего: [17]
  • Гости: [15]
  • Поисковые роботы: [2] Яндекс, Google
  • Сегодня нас посетили: [7] Google, Larrytitly, Яндекс, Яндекс, irbees2008, Google, dankeanke
  • SQL запросов: 27
  • Генерация страницы: 0.092сек
  • Потребление памяти: 2.964 Mb 
  •   Яндекс.Метрика