|
|
|
| Подскажите, пожалуйста, можно ли в таблицах width изменять динамически? Пытался так:
<script language="javascript">
function scrol()
{
document.getElementById('table').width='10%';
}
</script>
<table width="200" border="1">
<tr>
<td id="table" width="50%">
<img src="scroll1.gif" width="100%" height="8">
</td>
<td>
123
</td>
</tr>
</table>
<button onClick="scrol()">123</butto>
|
но ничего не выходит! | |
|
|
|
|
|
|
|
для: GлюК
(18.09.2006 в 23:11)
| | вот сделал что-то вроде того что ты хотел но Опера не хавает почему-то... во всех остальных браузерах(IE,FF,Netscape,NeoPlanet) все работает. может кто-то поумнее скажет чо за фигня...
линк | |
|
|
|
|
|
|
|
для: Padonak
(19.09.2006 в 03:43)
| | Padonak, вот в том-то и дело, что в Opera не работает!
targa, дело не в butto!:) Это я просто когда сюда текст вырезал (у меня-то код несколько объёмней) лишнего подтёр видать!
А выход я всё-таки нашёл! Просто перед изменением размера сделал скрытие объекта:
<script language="javascript">
function scrol()
{
document.getElementById('table').style.display='none';
document.getElementById('table').width='10%';
document.getElementById('table').style.display='none';
}
</script>
|
| |
|
|
|
|
|
|
|
для: GлюК
(18.09.2006 в 23:11)
| |
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Новая страница 1</title>
<script language="javascript" type="text/javascript">
<!---
function scrol()
{
document.getElementById('table').width='10%';
}
//-->
</script>
</head>
<body>
<table width="200" border="1">
<tr>
<td id="table" width="50%">
<img src="scroll1.gif" width="100%" height="8"> </td>
<td>123 </td>
</tr>
</table>
<button onclick="scrol()">123</button>
</body>
</html>
|
Не работает потому, что у Вас вместо
<button onClick="scrol()">123</button>
|
написано
<button onClick="scrol()">123</butto>
|
| |
|
|
|
|
|
|
|
для: targa
(19.09.2006 в 04:06)
| | Опера проценты динамически не берёт, только px подавай. | |
|
|
|
|
|
|
|
для: 12345
(19.09.2006 в 14:07)
| | 12345 это ты про мои заклинания? | |
|
|
|
|
|
|
|
для: Padonak
(19.09.2006 в 14:23)
| | Padonak: Ссылку не смотрел, но в исходном примере - проценты. Их надо переводить в px для Оперы, если работать с ними в скрипте. | |
|
|
|
|
|
|
|
для: 12345
(19.09.2006 в 17:34)
| | все наконец заработало и в проклятой Опере. с учетом того что без рукоблудия с дисплей:нан она действительно артачилась срабатывать. но по ходу пьесы выяснилось еще что помимо изменения ширины той ячейки которую хочешь изменить надо еще изменить и соседнюю чтобы пропорции таблицы сохранились. блин ну что за браузер такой! все нормально работают а тут надо с подвывертом каким-то... короче вот последняя редакция моих заклинаний на данную тему:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>No any title</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
<!--
body{
color:#000;
background-color:#f1f1f1;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:14px;
}
td{
text-align:center;
}
button{
padding:0px 10px 0px 10px;
margin:0px 10px 0px 10px;
font-size:14px;
font-weight:bold;
}
.meas{
font-size:18px;
font-weight:700;
color:#00008b;
background-color:#fff;
}
-->
</style>
<script language="javascript" type="text/javascript">
<!--
function scrol(n){
var W = document.getElementById("theTable").width;
document.getElementById("tbl").setAttribute("width",W/100*n);
if(navigator.userAgent.indexOf("Opera") != -1){
document.getElementById("theTable").style.display = "none";
document.getElementById("tbl").setAttribute("width",W/100*n);
document.getElementById("tbl").nextSibling.setAttribute("width",200-W/100*n);
document.getElementById("theTable").style.display = "block";
}
document.getElementById("indicator").innerHTML = "Ñåé÷àñ øèðèíà èçìåíÿåéìîé ÿ÷åéêè òàáëèöû ðàâíà <span class='meas'>" + document.getElementById("tbl").offsetWidth + " px<\/span>";
}
//-->
</script>
</head>
<body>
<div style="text-align:center;padding-top:30%">
<table id="theTable" align="center" border="0" cellpadding="0" cellspacing="0" width="200">
<tr>
<td id="tbl" width="50%" style="background-color:#fff;color:#000;">1</td>
<td style="background-color:#ccc;color:#000;">2</td>
</tr>
</table>
<br /><br />
<button onClick="scrol(10)" onfocus="blur()">10%</button>
<button onClick="scrol(50)" onfocus="blur()">50%</button>
<button onClick="scrol(80)" onfocus="blur()">80%</button>
<br /><br />
<div id="indicator"></div>
</div>
</body>
</html>
|
| |
|
|
|