Tab
|
|
Автор: Александр
Опубликовано: 354 дня назад (4 июня 2011)
Блог: Spyver-Blog
Рубрика: Web-дизайн
Редактировалось: 1 раз — 4 июня 2011
Играет: Deathstars
|
+27↑ Голосов: 27 |
Решил вот сделать таб-закладки на сайте.Выдернул скрипт со старого своего проекта ну и вставил на новый проект.В стиле css не стал менять классы,лень как-то было,и оставил старые.
Начнем разборку полетов.
в css вашего шаблона вставляем
закидываем в папку вашего шаблона с картинками.
Файл moduletab.php бросаем в includes/myphp.
Файл tabcontent.js кидаем в любое место (прописывать между <head></head> не надо,путь редактируется в moduletab.php).
Теперь бежим в админ.центр в Модули.
Создаем новый модуль в котором выбираем название ,позицию и вставляем внешний скрипт {ФАЙЛ=moduletab.php}.
Впринципе все,пример можно глянуть на Script-Portal.
Не забудьте только отредактировать все пути в файлах под свои нужды,а в moduletab.php поставить свои позиции для выводимых модулей.Количество вкладок (по горизонту) ограничивается только шириной вашего браузера.
Ну и не забываем про исходники файлов.Скачать
Начнем разборку полетов.
в css вашего шаблона вставляем
Код PHP:
.userinfo .shadetabs, .userinfo .shadetabs li { padding: 0; margin: 0; list-style: none; background: none; }
.userinfo .shadetabs {
display: block;
height: 27px;
padding-left: 0px;
overflow: hidden;
}
.userinfo .shadetabs li { float: left; }
.userinfo .shadetabs li a {
float: left;
width: 160px; height: 27px;
line-height: 29px;
text-decoration: none !important;
color: #393939;
font-size: 13px;
background: #f4f4f3 url("/templates/ваш-шаблон/images/userinfo_tabs.png") no-repeat right -27px;
text-align: center;
}
.userinfo .shadetabs li a.selected { line-height: 27px; color: #c9553f; background: url("/templates/ваш-шаблон/images/userinfo_tabs.png") no-repeat right top; }
.userinfo .tabcontent{ display: none; padding: 10px 0; }
@media print {
.userinfo .tabcontent {
display:block !important;
}
}
.userinfo .shadetabscont {
background-color: #fff;
border: 1px solid #cecece;
padding-top:1px;
}
Файл moduletab.php бросаем в includes/myphp.
Файл tabcontent.js кидаем в любое место (прописывать между <head></head> не надо,путь редактируется в moduletab.php).
Теперь бежим в админ.центр в Модули.
Создаем новый модуль в котором выбираем название ,позицию и вставляем внешний скрипт {ФАЙЛ=moduletab.php}.
Впринципе все,пример можно глянуть на Script-Portal.
Не забудьте только отредактировать все пути в файлах под свои нужды,а в moduletab.php поставить свои позиции для выводимых модулей.Количество вкладок (по горизонту) ограничивается только шириной вашего браузера.
Ну и не забываем про исходники файлов.Скачать
| # 4 июня 2011 в 14:50 0 | ||||
|
| # 4 июня 2011 в 15:12 0 |
| # 4 июня 2011 в 15:13 0 | ||
|
| # 4 июня 2011 в 15:25 0 | ||
|
| # 4 июня 2011 в 19:52 0 | ||
|
| # 5 июня 2011 в 02:08 +2 | ||
|
| # 5 июня 2011 в 10:41 0 |
| # 6 июня 2011 в 15:36 0 | ||
|
| # 1 августа 2011 в 15:47 0 | ||
|
| # 27 ноября 2011 в 20:17 0 | ||
|
| # 12 декабря 2011 в 00:26 0 |
| # 12 декабря 2011 в 00:34 0 | ||
|
| # 17 января 2012 в 12:05 0 | ||
|
| # 18 января 2012 в 13:24 0 | ||
|
| # 19 января 2012 в 11:52 0 | ||
|
