Форум поддержки пользователей ZeroParking

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Форум поддержки пользователей ZeroParking » Вопросы по скриптам » Работа вложенных таблиц со вкладками


Работа вложенных таблиц со вкладками

Сообщений 1 страница 3 из 3

1

Доброго вечера всем. Собственно говоря, для одной игры решился я сделать дизайн, да вот незадача: нужно мне, чтобы таблица со вкладками работала в таблице со вкладками. В одной из них, так сказать. Стиль ее я настроить сумел, а вот скрипт отказывается работать - не скрывает инфу предыдущей вкладки.

http://dizpolygon.0pk.ru/

Мы здесь. А скрипт вот.

<script type="text/javascript">
  $(document).ready(function(){
    $('.splLink').click(function(){
      $(this).parent().children('div.splCont').toggle('normal');
      return false;
    });
  });
</script>

<script type="text/javascript">

$(document).ready(function() {

$(".tab_content").hide();
$("ul.tabs li:first").addClass("active").show();
$(".tab_content:first").show();

$("ul.tabs li").click(function() {
    $("ul.tabs li").removeClass("active");
    $(this).addClass("active");
    $(".tab_content").hide();
    var activeTab = $(this).find("a").attr("href");
    $(activeTab).fadeIn();
    return false;

});

});

$(document).ready(function() {

$(".tab_content2").hide();
$("ul.tabs2 li:first").addClass("active").show();
$(".tab_content2:first").show();

$("ul.tabs2 li").click(function() {
    $("ul.tabs2 li").removeClass("active2");
    $(this).addClass("active2");
    $(".tab_content2").hide();
    var activeTab = $(this).find("a").attr("href");
    $(activeTab).fadeIn();
    return false;
});

});

</script>

<style>
.container {width: 821px; margin: 0 auto; padding: 0;}
ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    height: 34px;
    width: 100%;
}
ul.tabs li {
    float: left;
    margin: 0;
    height: 34px;
    line-height: 34px;
width: 157px;
    margin-bottom: -2px;
    background: url(http://mafia-power.ucoz.ru/ginny/main-mav-bg.png);
    overflow: hidden;
    position: relative;

}

ul.tabs li a {
    text-decoration: none;
    color: #f0ede8!important;
    display: block;
    padding-left: 2em;
    background: url();
    outline: none;
}

ul.tabs li a:hover {
    color: #f0ede8!important;
text-shadow: #ff7676 0px 0px 6px, #5e0404 0px 0px 4px;
       background: url(http://mafia-power.ucoz.ru/ginny/li_active.png);
}   

html ul.tabs li.active  {text-shadow: #ff7676 1px 1px 3px;
    background: url(http://mafia-power.ucoz.ru/ginny/li_active.png);   
    border-bottom: 0px solid #000000;
        border-top: 0px solid #000000;   
        border-left: 0px solid #000000;   
        border-right: 0px solid #000000;   

html ul.tabs li.active a:hover  {
        background: url();
    border-bottom: 0px solid #160f0a;
}

.tab_container1 {
    clear: both;
    float: center;
    width: 780px;
    height: 447px;
    background-image : url(http://mafia-power.ucoz.ru/ginny/tab-new.png);   
background-position: top center; background-repeat: no-repeat;
background-color: transparent; 
    border-bottom: 1px solid #000000;
        border-top: 0px solid #000000;   
        border-left: 0px solid #000000;   
        border-right: 0px solid #000000; 

    -moz-border-radius-bottomright: 5px;
    -khtml-border-radius-bottomright: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-bottomleft: 5px;
    -khtml-border-radius-bottomleft: 5px;
    -webkit-border-bottom-left-radius: 5px;
}

.tab_content {margin-top: 60px;
    padding: 5em  2em 1em 2em;
}

.tab_content h2 {
    font-weight: normal;
    padding-bottom: 2px;
    border-bottom: 0px dashed #000000;
}

.container2 {width: 700px; margin: 0 auto;}

ul.tabs2 {
    margin: 0;
    padding: 0;
    float: right;
    list-style: none;
    height: 40px;
    width: 100%;
}

ul.tabs2 li {
    float: center;
    margin-top:0;
    padding: 0;
    height: 34px;
    line-height: 34px;
width: 157px;
    margin-bottom: 6px;
    overflow: hidden;
    position: relative;
    background: url(http://mafia-power.ucoz.ru/ginny/main-mav-bg.png);
}

ul.tabs2 li a {
    text-decoration: none;
    color: #f0ede8!important;
    display: block;
    padding-left: 2em;
    background: url();
    outline: none;
}

ul.tabs2 li a:hover {
    color: #f0ede8!important;
text-shadow: #ff7676 0px 0px 6px, #5e0404 0px 0px 4px;
       background: url(http://mafia-power.ucoz.ru/ginny/li_active.png);
}   

html ul.tabs2 li.active2  {text-shadow: #ff7676 1px 1px 3px;
    background: url(http://mafia-power.ucoz.ru/ginny/li_active.png);   
    border-bottom: 0px solid #000000;
        border-top: 0px solid #000000;   
        border-left: 0px solid #000000;   
        border-right: 0px solid #000000;   

.tab_container2 {
    -moz-border-radius: 8px;
    -khtml-border-radius: 8px;
    -webkit-border-radius: 8px;
    clear: both;
    float: right;
    width: 70%;
    height: 350px;
margin-top: -46px;
background-color: #dcf1f9; 
  filter:alpha(opacity=60)!important;
  opacity: 0.6!important;
  -moz-opacity: 0.6!important;
  -khtml-opacity: 0.6!important;
}

</style>

<div class="container">
    <div class="html-box">
      <div class="tab_container1">

<div style="display: block;" id="tab1" class="tab_content">
текст 1
</div>

<div style="display: none;" id="tab2" class="tab_content">

<div class="container2">
    <div class="html-box2">

<ul class="tabs2">
    <li class="active2"><a href="#tab11">Новости</a></li>
    <li><a href="#tab12">Игры</a></li>
    <li><a href="#tab13">Администрация</a></li>
</ul>
      <div class="tab_container2">

<div style="display: block;" id="tab11" class="tab_content">
текст 1
</div>

<div style="display: none;" id="tab12" class="tab_content">
текст 2
</div>

<div style="display: none;" id="tab13" class="tab_content">
текст 3
</div>

      </div>

    </div>
</div>


</div>

<div style="display: none;" id="tab3" class="tab_content">
текст 3
</div>

      </div>

<ul class="tabs">
    <li class="active"><a href="#tab1">Новости</a></li>
    <li><a href="#tab2">Игры</a></li>
    <li><a href="#tab3">Администрация</a></li>
</ul>

    </div>
</div>

0

2

Януш :glasses: Нафига Вам сложности - мну даже лень разбираться - когда я Выкладывал такую же таблицу - но проще

У этой таблицы - ток сss прописан покрасивше - Вы с Вашим опытом могли бы стиль по сss точно такой же заварганить

0

3

Deff
А вообще да, логичнее внутрь будет вашу поставить, хех. Надеюсь, они не будут конфликтовать.
Да ладно, мой опыт - сын ошибок трудных) Я еще многого не знаю)

0


Вы здесь » Форум поддержки пользователей ZeroParking » Вопросы по скриптам » Работа вложенных таблиц со вкладками


Рейтинг форумов | Создать форум бесплатно