Доброго времени суток! имеется довольно тривиальный макет : Код (Text): <table style="height:100%;vertical-align:top;"> <tr><td id=menu> тут меню </td><td> //тело страницы <img src="back.jpg" style="width:100%;height:100%;vertical-align:top;display:ctable-cell;" ALT="Стол"> </td> </tr> </table> Возникает сразу два вопроса.Во-первых.Хотелось бы чтобы изображение back.jpg адаптировалось по высоте под размеры окна.Но адаптируется только по ширине.Во-вторых.некоторые области изображения должны ссылаться на другие страницы.Как использовать тег <map> если размеры изображения заданы в процентах ? Заранее благодарен
Вы должны четко понимать, что изменять картинки через браузер очень накладно. Если на странице несколько картинок, то браузер может подвиснуть, а скролл будет тормозить.
Ну вот мне как раз хочется чтобы вертикального скрола не было..А макет без картинок увы никак : verticalkursk.ru
Ну и нафига, спрашивается, делать так, как делаете вы? Если вас не устраивает наложение div слоев с относительным позиционированием, то тогда делайте так: Создайте изображение-карту нормальных размеров и разместите её посреди экрана. Какой смысл растягивать? Если уж на то пошло, проверяйте разрешение экрана пользователя и формируйте соответствующий контент на странице, если вам так важен размер. А вообще, можно сделать одно изображение, размещенное как у вас, которое не ресайзится. Ну, или на крайний случай, при заходе пользователя на сайт, определять разрешение и с помощью AJAX запрашивать с сервера необходимое изображение (или генерируйте) ... Вообще, средствами CSS - это жуткие тормоза.
При относительном похиционировании возникает проблема:На моём мониторе всё нормально.На широкоформатном все детали,которые на столе,"уезжают" влево