Модератор форума: JonMagon |
Сообщество uCoz Вебмастеру JavaScript, Flash и прочие технологии jQuery TabControl (Реализация блока с вкладками на jQuery) |
TabControl |
если на одном сайте будет несколько табов , тогда соответственно меняйте классы и добавляйте эти классы в ксс
например Код <div class="sectiontable first"> Код <div class="sectiontable second"> Код <div class="sectiontable third"> и в ксс Код .sectiontable.first { width: 200px; background: #EFEFEF; margin: 0 0 30px; } Код .sectiontable.second { width: 250px; background: #EFEFEF; margin: 0 0 30px; } Код .sectiontable.third { width: 350px; background: #EFEFEF; margin: 0 0 30px; } Сообщение отредактировал killbit - Четверг, 02 Июл 2015, 19:01:23
|
Уважаемые знатоки!
Помогите, пожалуйста! Опробовал "вкладки", настроил все вот тут http://1221proba.ucoz.com/index/0-2 Далее скопировал весь код на нужный сайт, вот сюда http://www.uyut-nsk.ru/ Вкладки сместились вправо, одна ушла вниз. Подскажите, как выровнять! методом тыка не могу найти причину( Код /* TabControl Start */ p {padding: 7px 0;} .sectiontable { width: 100%; background: #ffffff; margin: 0 0 30px; } ul.tabs { height: 28px; line-height: 25px; list-style: none; border-bottom: 1px solid #DDD; background: #FFF; } .tabs li { float: left; display: inline; margin: 0 1px -1px 0; padding: 0 4px 1px; color: #777; cursor: pointer; background: #F9F9F9; border: 1px solid #E4E4E4; border-bottom: 1px solid #F9F9F9; position: relative; } .tabs li:hover, .vertical .tabs li:hover { color: #030303; padding: 0 4px; background: #ffffff; border: 1px solid #66a312; } .tabs li.current { color: #444; background: #ffffff; padding: 0 13px 2px; border: 1px solid #D4D4D4; border-bottom: 1px solid #EFEFEF; } .box { display: none; border: 1px solid #D4D4D4; border-width: 0 1px 1px; background: #ffffff; padding: 0 12px; } .box.visible { display: block; } .section.vertical { width: 440px; border-left: 160px solid #FFF; } .vertical .tabs { width: 160px; float: left; display: inline; margin: 0 0 0 -160px; } .vertical .tabs li { padding: 0 13px; margin: 0 0 1px; border: 1px solid #E4E4E4; border-right: 1px solid #F9F9F9; width: 132px; height: 25px; } .vertical .tabs li:hover { width: 131px; } .vertical .tabs li.current { width: 133px; color: #444; background: #ffffff; border: 1px solid #D4D4D4; border-right: 1px solid #EFEFEF; margin-right: -1px; } .vertical .box { border-width: 1px; } /* TabControl End */ Сообщение отредактировал Радужный - Суббота, 29 Авг 2015, 00:48:22
|
|
| |||