lazybaby
-
Posts
16 -
Joined
-
Last visited
lazybaby's Achievements
Explorer (1/14)
0
Reputation
-
Есть TD, в которой присутствует картинка, ширина которой в общем случае неизвестна, и текст. Картинка скрыта (display:none). Ширина ячейки задана, и она меньше ширины скрытой картинки. При этом ячейка отображается по заданной ширине, т.е. ширина скрытой картинки игнорируется. Если картинку сделать видимой (display:block), то ширина ячейки становится равной ширине картинки, что и требуется! Собственно задача - необходимо сделать ширину ячейки со скрытой картинкой (неизвестной ширины) равной ширине этой картинки. А в общем случае - ширине любого скрытого контента в состоянии, когда он не скрыт. При этом контент внутри может быть самый разный, т.е. (если что) неизвестно у какого скрытого элемента выяснять его ширину Для конкретики минимальный код: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> </head> <body> <table width="100%" border="1"><tr><td width="50px"> <!-- Ширина ячейки 50px --> <div id="header"> Some text </div> <div id="content"> <div style="display:block"> <img src="img.jpg"> <!-- Ширина картинки > 50px, например, 200px --> </div> </td><td></td></tr></table> </body> </html> Идеи?
-
Собственно код: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <style type="text/css"> #foo { display:none; } </style> </head> <body> <div id="foo">Some text</div> <script type="text/javascript"> alert(document.getElementById("foo").style.display); </script> </body> </html> Ожидаю, естественно, получить "none", а в итоге - пустая строка. При этом если задать атрибут прямо в тэге (т.е. style="display:none") получаем то, что и требуется. Идеи?
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <style> #div1 { position: relative; } #div2 { position: absolute; background: red; left: 40%; width: 5%; top: 20%; height: 10%; } </style> </head> <body> <div id="div1"><img src="http://www.unity.freenet.kz/map/proekcia3.jpg" width="100%"> <div id="div2"></div> </div> <script> alert (document.getElementById("div2").parentNode.offsetHeight + " : " + document.getElementById("div2").offsetHeight); </script> </body> </html> Во всех браузерах работает, кроме IE6. В нём совершенно непонятно как устанавливается высота div2. Точно не 10% (скрипт ниже это демонстрирует), и к тому же не масштабируется при изменении размеров окна. P.S. Нашел решение. Как то так: body { height:100%; } <!--[if IE 6]> <style> * body #div1 { height:100%; } </style> <![endif]--> Условие необходимо, т.к. иначе ломается во всех остальных браузерах.
-
Решение подсказали здесь!
-
неа
-
Ок, тогда вопрос: как втиснуть в div очень большой img, чтобы он автоматически сжимался по размеру блока?
-
хм, на картинку expression повесить, или в body.onload=function(){ } Пробовал img { width:100%; width:expression(document.getElementById("i").parentNode.parentNode.width+"px"); /* Ширина table */ } <img id="i" ... Не сработало, возможно в expression какой-то косяк... Ширина моего экрана - 1280, а картинка - 1253 - картинка там все 1500px Имел в виду http://forum.htmlbook.ru/style_images/elegance/logo4.gif
-
Ширина моего экрана - 1280, а картинка - 1253. Попробуйте с этой: http://www.unity.freenet.kz/map/proekcia3.jpg
-
Не работает. У Вас точно картинка больше экрана?
-
Неа. Проверьте сами (IE6 или IE7)
-
Мыши кололись, плакали, но продожали жрать кактус (С)
-
Не помогает. На дивах с кроссбраузерность вообще мрак
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html> <body style="width:100%"> <table width="100%"><tr><td> <img src="image.jpg" width="100%"> </td></tr></table> </body> </html> Не помогает.
-
Не помогает.
-
Не помогает.