Лента Каталог Файлы Форумы Услуги
ОсновноеRadiotalkПользовательское
Программирование
6   •   Посмотреть все темы

Неполное отображение блока DIV

 
1

8497
Степан @Trilby
Всем привет, сразу вопрос.
Хочу реализовать следующее: Есть блок, допустим 800*400 (может быть гораздо шире!)
Нужно отобразить только с 200 до 600 пикселей в ширину. При этом так, чтобы оставшиеся 200 пикселей не вылезали за сцену (соответственно вариант со слоями не годится)
И ноещё... Надо сделать так, чтобы эти значения (200, 600) при изменении корректно отображали блок

6600
Александр @admiral
Так?
1. Стили:
#width_min_max {
min-width: 200px; /* минимальная ширина у всех кроме ie */
max-width: 600px; /* максимальная ширина у всех кроме ie */
width:expression(document.body.clientWidth < 200? "200px" : document.body.clientWidth > 600? "600px" : "auto"); /* для ie */
background-color:#ffffff; /* фон по желанию */
}

2. html:
<div align="center">
<div id="width_min_max">Это видно</div>
</div>

8497
Степан @Trilby
Неа, не то(
<html>
<head><title>Test</title><style>#width_min_max {
min-width: 200px; /* минимальная ширина у всех кроме ie */
max-width: 600px; /* максимальная ширина у всех кроме ie */
width:expression(document.body.clientWidth < 200? "200px" : document.body.clientWidth > 600? "600px" : "auto"); /*

для ie */
background-image: url('https://forum.vmeste.eu/upload/1437_1282718025.jpg');
}</style></head>
<body bgcolor=#333>
<div align="center">
<div id="width_min_max">Це видно</div>
</div>
</body>
</html>
Картинка показывается, как обычно... Сейчас покажу кодом то, что я хочу:

<html>
<head><title>Test</title><style>#width_min_max {
width: 400px;
height: 400px;
background-image: url('https://forum.vmeste.eu/upload/1437_1282718025.jpg');
background-position:600px 0px;
}</style></head>
<body bgcolor=#333>
<div align="center">
<div id="width_min_max"></div>
</div>
</body>
</html>
Как видно, серое не видно (о как завернул!)
При этом я хочу так отцентрировать (background-position:600px 0px;) не фон, а целый блок. Ну там, картинки через <img>, текст какой-то

8497
Степан @Trilby
<div align='center'>
<div style='width: 400px; height: 400px; overflow: auto; overflow:hidden; '>
<div style='margin: 0px; margin-left: -400px; width: 400px; height: 400px;'>
<img src='https://forum.vmeste.eu/upload/1437_1282718025.jpg'>
</div>
</div>
</div>
Бред, но работает)) Сам написал, когда понял - как работает overflow... margin-left: -400px; - только так смог настроить позицию блока)))
Тему можно закрывать, но удалять не стоит. А вдруг кому-нибудь пригодится..

p.s. Если кто найдёт альтернативу отрицательного маргина для IE, а так же протестит везде кроме мозиллы - большой чмаф 😁

Отредактировано Trilby - 26.08.2010