Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях

Правила форума

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: Savepic Видео фоторедактор Транслит

Панель, выдвигающаяся слева

Предыдущая тема Следующая тема Перейти вниз

Панель, выдвигающаяся слева

Сообщение автор moresol в Чт 29 Сен - 22:14

Подскажите, как можно сделать выезжающую панельку, навроде этой

http://radical-foto.ru/fp/d49045a717be9927162a3ef5

moresol
 

Женщина

Сообщения : 257
Регистрация : 2010-12-12
Благодарности : 4

Без предупреждений

http://mnenie.forumotion.com

Вернуться к началу Перейти вниз

Панель, выдвигающаяся слева

Сообщение автор Dana Domirani в Чт 29 Сен - 22:19

Могу предложить такой вариант: поставьте в виджет на главной странице

Код:
<!-- Начало настройки оформления панели слева -->

<style type="text/css">
#leftpanel:hover { /* изменение отступа слева при наведении */
margin-left: 250px;
}

/* общие настройки для ярлыка и содержимого Боковой панели*/
#leftpanel, #leftpanel .filling{
border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
-moz-border-radius:10px;
-o-border-radius:10px;
background-color:#F0F0F0; /* цвет фона панели */
box-shadow: 0px 5px 5px #626262; /* тень панели */
-webkit-box-shadow:0px 5px 5px #626262;
-khtml-box-shadow:0px 5px 5px #626262;
-moz-box-shadow:0px 5px 5px #626262;
}

/* ярлык Боковая панель */
#leftpanel {
height:140px; /* высота */
width:230px; /* ширина */
position:fixed;
z-index:1200;
top:8px;
left:-190px; /* ширина, на которую она спрятана за левый край экрана*/
margin-left: 0px;
background:#F0F0F0 url(http://i33.servimg.com/u/f33/17/37/83/89/image011.png) center right no-repeat; /* кнопка с текстом боковое меню */
transition-duration: 0.33s;
-webkit-transition-duration: 0.33s;
-moz-transition-duration: 0.33s;
-o-transition-duration: 0.33s;
}

/* содержимое Боковой панели */
#leftpanel .filling {
padding:12px;
height: 400px; /* высота */
width:100%;
margin:-1px 0 0 -70px;
}

#patch2 {
position:absolute;
height:140px; /* высота должна быть равна высоте ярлыка */
width:11px;
background-color:#F0F0F0;
margin: -11px 0 0 234px;
}
</style>

<!-- Конец настройки оформления панели слева -->

<!-- Начало кода панели слева -->
<div id="leftpanel"><div class="filling"><div id="patch2"></div><div id="inr">

<!-- начало содержания -->
Тут любой ваш контент: ссылки, меню и т.д.
<!-- конец содержания -->

</div></div>

<!-- Конец кода панели слева -->






Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Женщина

Сообщения : 22076
Возраст : 32
Место обитания : СПб
Регистрация : 2008-04-18
Благодарности : 8874

Без предупреждений

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения