2. Сделал что-то типа элемента управления Tab. Делал в виде таблицы, при нажатии на определённые ячейки которой должен меняется стиль (смена класса, см. ниже) бывшей вкладки на невыделенный и выделяться должна новая текущая вкладка.
джавакод:
- Код: Выделить всё
function setAttrById (elem_id, attr_name, attr_val) {
//var oldval = document.getElementById (elem_id).attributes.item (attr_name).value;
document.getElementById (elem_id).attributes.item (attr_name).value = attr_val;
return true;
}
function SwitchTab(elem_fid) {
tdtags = document.all.tags('TD');
i = 0;
while (i<tdtags.length){
MyStr = tdtags[i].attributes.item('class').value;
if (MyStr) {
if (MyStr.indexOf('_l')>2 ) {
if (tdtags[i].attributes.item('id').specified) {
IndStr = tdtags[i].attributes.item('id').value;
if (IndStr != "") setAttrById(IndStr, 'class','topmenu_l');
}
}
if (MyStr.indexOf('_r')>2 ) {
IndStr=tdtags[i].attributes.item('id').value;
if (IndStr != "") setAttrById(IndStr, 'class','topmenu_r');
}
if (MyStr.indexOf('menu')>2 ) {
IndStr=tdtags[i].attributes.item('id').value;
if (IndStr != "") setAttrById(IndStr, 'class','topmenu');
}
}
i++;
}
setAttrById (elem_fid + '_l' , 'class' , 'currentmenu_l');
setAttrById (elem_fid, 'class', 'currentmenu');
setAttrById (elem_fid + '_r' , 'class' , 'currentmenu_r');
return true;
}
стиль:
- Код: Выделить всё
.topmenu {
FONT-WEIGHT: bold; COLOR: #000033; TEXT-DECORATION: none; cursor:pointer; background-color: #3399CC; text-align:center;
}
.topmenu_l {
background-image: url(/images/top_l_inactive.gif);
}
.topmenu_r {
background-image: url(/images/top_r_inactive.gif);
}
.currentmenu {
FONT-WEIGHT: bold; color:#FF0000; background-color:68cccc; text-align:center;
}
.currentmenu_l {
background-image: url(/images/top_l_active.gif);
}
.currentmenu_r {
background-image: url(/images/top_r_active.gif);
}
.underlinemenu_pas {
background:#3399CC; height:7px;
}
.underlinemenu_act {
background:#66CCCC; height:7px;
хтмл (лишнее обрезано):
- Код: Выделить всё
<TABLE>
<TR>
<TD class="topmenu_l" id=qwe> </TD>
<TD class="topmenu" onClick="blabla" id=qwe>TabCaption 1</TD>
<TD class="topmenu_r" id=qwe> </TD>
<TD> </TD>
<TD class="topmenu_l"> </TD>
<TD class="topmenu" onClick="blabla">TabCaption2</TD>
<TD class="topmenu_r"> </TD>
<TD> </TD>
<TD class="topmenu_l"> </TD>
<TD class="topmenu" onClick="blabla">TabCaption3</TD>
<TD class="topmenu_r"> </TD>
</TR>
<TR>
<TD colspan="11"> </TD>
</TR>
</TABLE>
PHP вставочка:
echo "<SCRIPT type='text/javascript' language='JavaScript'>
SwitchTab($_GET["qwe"]);
</SCRIPT>";
</code>
Внимание, вопрос: Когда я меняю класс стиля тега TD (.topmenu_l), где должна подложиться новое изображение, но ничего не появляется.... Короче, вместо того, чтобы мои неактивные вкладки были округлены, они отображаются квадратными... Кстати, не помню где встречал функцию, писанную на джаваскрипте, которая, судя по названию (не помню) округляла табы. Короче, проверял я что в моих тегах класс меняется, даже изображение есть (TD присвоено background-image). То есть, оно есть, но в броузере (IE, Мозилла) я его не вижу. Какие будут советы?