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

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


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

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

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


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

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

Увеличивающиеся кнопки и т.д.

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

Увеличивающиеся кнопки и т.д.

Сообщение автор СаШоК в Сб 23 Июн - 15:43

Можете ли вы мне дать код, если чтонибудь в этот код вставить то это то что ты вставил будет увеличиваться как на этом сайте вверху

СаШоК
 

Мужчина

Сообщения : 108
Возраст : 18
Регистрация : 2012-06-03
Благодарности : 1

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

http://communication.forum2x2.ru

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

Re: Увеличивающиеся кнопки и т.д.

Сообщение автор Dana Domirani в Сб 23 Июн - 18:33



1. Добавляете код меню (в шаблон, виджет, объявление или в приветствие на главной странице)
Код:
<script type="text/javascript" src="http://www.patmax.eu/J1/120623163723.js"></script>
<div class="dock" id="dock">
  <div class="dock-container" style="left: 333.5px; width: 280px; ">
  <a class="dock-item" href="#" style="width: 40px; left: 0px; "><img src="http://i44.servimg.com/u/f44/16/54/26/99/home10.png" alt="Кнопка 1" /><span style="display: none; ">Кнопка 1</span></a>
  <a class="dock-item" href="#" style="width: 40px; left: 40px; "><img src="http://i44.servimg.com/u/f44/16/54/26/99/email13.png" alt="Кнопка 2" /><span style="display: none; ">Кнопка 2</span></a>
  <a class="dock-item" href="#" style="width: 40px; left: 80px; "><img src="http://i44.servimg.com/u/f44/16/54/26/99/portfo10.png" alt="Кнопка 3" /><span style="display: none; ">Кнопка 3</span></a>
  <a class="dock-item" href="#" style="width: 40px; left: 120px; "><img src="http://i44.servimg.com/u/f44/16/54/26/99/video10.png" alt="Кнопка 4" /><span style="display: none; ">Кнопка 4</span></a>
  <a class="dock-item" href="#" style="width: 40px; left: 160px; "><img src="http://i44.servimg.com/u/f44/16/54/26/99/music10.png" alt="Кнопка 5" /><span style="display: none; ">Кнопка 5</span></a>
  <a class="dock-item" href="#" style="width: 40px; left: 200px; "><img src="http://i44.servimg.com/u/f44/16/54/26/99/histor10.png" alt="Кнопка 6" /><span style="display: none; ">Кнопка 6</span></a>
  <a class="dock-item" href="#" style="width: 40px; left: 240px; "><img src="http://i44.servimg.com/u/f44/16/54/26/99/rss10.png" alt="Кнопка 7" /><span style="display: none; ">Кнопка 7</span></a>
</div>
</div>
В каждой строке
Код:
<a class="dock-item" href="#" style="width: 40px; left: 240px;"><img src="http://servimg.com/01/img.png" alt="Кнопка" /><span style="display: none; ">Кнопка</span></a>
вместо # во фрагменте href="#" подставляете ссылку на Ваш раздел, а вместо картинки по-умолчанию — ссылку в свою иконку.
Сохраняете.

2. В CSS добавляете код:
Код:
.dock {
   position: relative;
   height: 50px;
   text-align: center;
}
.dock-container {
   position: absolute;
   height: 50px;
   background-color: transparent;
   padding-left: 20px;
}
a.dock-item {
   display: block;
   width: 40px;
   color: #000;
   position: absolute;
   top: 0px;
   text-align: center;
   text-decoration: none;
   font: bold 12px Arial, Helvetica, sans-serif;
}
.dock-item img {
   border: none;
   margin: 5px 10px 0px;
   width: 100%;
}
.dock-item span {
   display: none;
   padding-left: 20px;
}
Сохраняете.

3. В ПА > Модули > Управление кодами JS добавляете новый файл.
Активировать управление кодами Javascript : да
Название: иконки меню
Расположение: на всех страницах
Код:
Код:
$(document).ready(
      function()
      {
         $('#dock').Fisheye(
            {
               maxWidth: 100,
               items: 'a',
               itemsText: 'span',
               container: '.dock-container',
               itemWidth: 40,
               proximity: 90,
               halign : 'center'
            }
         )
      }
   );
Сохраняете.
Проверяете результат.



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


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


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


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

Женщина

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

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

http://poltergeist-legacy.com/

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

Re: Увеличивающиеся кнопки и т.д.

Сообщение автор СаШоК в Сб 23 Июн - 19:00

13 13 13

СаШоК
 

Мужчина

Сообщения : 108
Возраст : 18
Регистрация : 2012-06-03
Благодарности : 1

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

http://communication.forum2x2.ru

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

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


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