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

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


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

Мы в социальных сетях



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

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


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

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

Всплывающая панель

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

Всплывающая панель

Сообщение автор Аннет Долгих в Ср 7 Ноя - 7:42

Как сделать всплывающую панель справа?

Аннет Долгих
 
 

Пол : Женщина
Сообщения : 51
Карма : Без предупреждений
Благодарности : 0
Регистрация : 2012-10-03

http://era-katherine-pierce.forum2x2.com/

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

Re: Всплывающая панель

Сообщение автор Домовой в Ср 7 Ноя - 8:14

Выплывающая боковая панель

Подходит для версий форума [punBB][phpBB2]

1. ПА - Модули - HTML & JAVASCRIPT - Управление кодами Javascript
Создать новый Javascript
Название * : Боковая панель
Расположение : На всех страницах
Код Javascript * :
Код:
$(function(){
 $('.slide-out-div').tabSlideOut({
  tabHandle: '.handle',                                  /*класс элемента вкладки*/
  pathToTabImage: 'http://www.snapsnap.ru/i/cnccnc.png', /*путь к изображению "обязательно"*/
  imageHeight: '100px',                                  /*высота изображения "обязательно"*/
  imageWidth: '25px',                                    /*ширина изображения "обязательно"*/
  tabLocation: 'right',                                  /*сторона на которой будет вкладка top, right, bottom, или left*/
  speed: 500,                                            /*скорость анимации*/
  action: 'click',                                      /*опции=:'click'или'hover', анимация при нажатии или наведении*/
  topPos: '40px',                                        /*расположение от верхнего края/ использовать если tabLocation = left или right*/
  leftPos: '20px',                                      /*расположение от левого края/ использовать если tabLocation = bottom или top*/
  fixedPosition: true                                    /*опции: false сделает данную вкладку прокручивающуюся при скролле*/
  });
});
Сохраните.

2. ПА - Оформление - Шаблоны - Общие настройки
Откройте шаблон overall_footer_end (Конец нижней части страницы), в самый низ перед </body>вставьте
Код:
<!--боковая выдвижная панель-->
<script type="text/javascript" src="http://yourjavascript.com/92551122121/jquery.tabslideout.v1.2.js"></script>

<!--блок с содержимым-->
<div class="slide-out-div">
<a class="handle"></a>
Здесь ваше содержимое блока
  </div>
Сохранить и опубликовать шаблон.

3. В CSS вставьте коды оформления блока
Код:
/*оформление выдвигающегося поля*/
.slide-out-div {
width:100px; /* ширина */
height:100px !important; /* высота */
background-color:#FFFFF2; /* фон */
border:1px solid #E8C15D; /* рамка */
padding:12px; /* отступ содержимого от границ поля */
line-height: 1.6em;
}

/* оформление ссылок в панели */
.slide-out-div a {
font-family:Georgia; /* шрифт */
font-size:13px; /* размер текста */
color:#804804; /* цвет ссылок */
line-height: 1.6em;
}

/* цвет ссылок в панели при наведении курсора */
.slide-out-div a:hover {
color:#AC8E25;
}
Сохраните.
Оформление меняйте на свой вкус и цвет.

Выглядит в закрытом состоянии



В открытом состоянии



Живой пример у меня на форуме, только у там она слева.

Домовой
 
 

Пол : Мужчина
Сообщения : 6973
Возраст : 92
Место обитания : :яинатибо отсеМ
Карма : Без предупреждений
Благодарности : 3216
Регистрация : 2010-01-30

http://udomovogo.rusff.ru

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

Re: Всплывающая панель

Сообщение автор Аннет Долгих в Ср 7 Ноя - 9:59

спасибо огромное*

Аннет Долгих
 
 

Пол : Женщина
Сообщения : 51
Карма : Без предупреждений
Благодарности : 0
Регистрация : 2012-10-03

http://era-katherine-pierce.forum2x2.com/

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

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


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