| |
|
|
| | Здраствуйте Форумчане.
Помогите решить проблемку.
Имеем файлы style.css, index.html, common.js
Код в файле index.html:
<table border="0" width="100%" height="90" cellpadding="3" bgcolor="#fafafa">
<tr><td width="30%"></td><td align="left" width="50%">
<form>
<input name="type_adver" type="radio" onclick="visibON_editview()"> <font class="textadver">Вывод первой таблицы</font>
<p>
<input name="type_adver" type="radio" onclick="visibOFF_editview()"> <font class="textadver">Вывод второй таблицы</font>
</form>
<form>
</form>
</td>
</tr>
</table>
<!-- ТАБЛИЦА №1 -->
<div id="editview_tbl1" >
<table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0" bgcolor="#fafafa" style="padding: 0px">
<tr>
<td bgcolor="#99CC00" height="20" valign="baseline" style="padding: 10px;"><font class="titlemodule"><font color="White">Текс номер 1 </font></font></td>
</tr>
<tr>
</table>
<table border="1" width="100%" height="100%" cellpadding="10" cellspacing="0" bgcolor="#fafafa" class="Table">
<tr>
<td height="10"></td>
</tr>
<tr>
<td width="20%">
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td align="center" width="40%">
<table border="1" width="100%" cellpadding="0" cellspacing="0" class="Table_infoprice">
<tr>
<td align="center" width="100%">
<font class="textadver">Текст № 2</font><br></td>
</tr>
</table>
<td>Test</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<!-- Таблица №2 -->
<div id="editview_tbl2" >
<table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0" bgcolor="#fafafa" style="padding: 0px">
<tr>
<td bgcolor="#99CC00" height="20" valign="baseline" style="padding: 10px;"><font class="titlemodule"><font color="White">Текст № 3 </font></font></td>
</tr>
<tr>
</table>
<table border="1" width="100%" height="100%" cellpadding="10" cellspacing="0" bgcolor="#fafafa" class="Table">
<tr>
<td height="10"></td>
</tr>
<tr>
<td width="20%">
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td align="center" width="40%">
<table border="1" width="100%" cellpadding="0" cellspacing="0" class="Table_infoprice">
<tr>
<td align="center" width="100%">
<font class="textadver">Текс №4</font><br></td>
</tr>
</table>
<td>Test</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
|
Код в файле style.css:
#editview_tbl1 {
visibility: hidden;
position: static;
}
#editview_tbl2 {
visibility: hidden;
position: static;
}
|
Код в файле common.js:
function visibON_editview() {
document.getElementById("editview_tbl2").style.visibility="hidden";
document.getElementById("editview_tbl1").style.visibility="visible";
return false;
}
function visibOFF_editview() {
document.getElementById("editview_tbl1").style.visibility="hidden";
document.getElementById("editview_tbl2").style.visibility="visible";
}
|
При клике по переключателю №1 radio, таблица №1 появляется.
При клике по переключателю №2, таблица №1 исчезает, а таблица номер появляется, но она появляется не на месте таблице №1, а ниже нее.
Вопрос возник такой, как сделать чтобы и первая и вторая таблица отображалась на одном месте?
Или здесь без Ajax'a не обойтись? | |
| |
|
|
| |
|
|
| |
для: tokmak
(09.09.2008 в 12:30)
| | | может
document.getElementById("editview_tbl1").style.display="none";
поможет? | |
| |
|
|
| |
|
|
| |
для: Волки
(09.09.2008 в 12:47)
| | | ООО, спасибо огромное!
Вот, сделал так и заработало))
function visibON_editview() {
document.getElementById("editview_tbl2").style.display="none";
document.getElementById("editview_tbl1").style.display="inline";
return false;
}
function visibOFF_editview() {
document.getElementById("editview_tbl1").style.display="none";
document.getElementById("editview_tb2").style.display="inline";
}
|
| |
| |
|
|
| |
|
|
| |
для: tokmak
(09.09.2008 в 13:06)
| | | Опять беда :(
В Firefox'e и IE работает правильно, а в Opera происходит такой же сдвиг, одна таблица появляется на месте а вторая ниже первой. | |
| |
|
|
| |
|
|
| |
для: tokmak
(09.09.2008 в 13:56)
| | | Когда показываете таблицу желательно писать не inline а block | |
| |
|
|
| |
|
|
| |
для: tokmak
(09.09.2008 в 13:56)
| | |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
</head>
<body>
<script type="text/javascript">
<!--
function visibON_editview() {
document.getElementById("editview_tbl1").style.display="none";
document.getElementById("editview_tbl2").style.display="block";
}
function visibOFF_editview() {
document.getElementById("editview_tbl1").style.display="block";
document.getElementById("editview_tbl2").style.display="none";
}
//-->
</script>
<table height="90" cellpadding="3" bgcolor="#fafafa" style="width:100%; border-bottom-width:0px;">
<tr>
<td width="30%"></td>
<td align="left" width="50%"><form>
<input name="type_adver" type="radio" onclick="visibON_editview()"/>
<font class="textadver">Вывод первой таблицы</font>
<p>
<input name="type_adver" type="radio" onclick="visibOFF_editview()"/>
<font class="textadver">Вывод второй таблицы</font>
</form>
<form>
</form></td>
</tr>
</table>
<div id="editview_tbl1" style="display:none">
...........................
</div>
<div id="editview_tbl2" style="display:none">
............................
</div>
</body>
</html>
|
| |
| |
|
|
