Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > swf в качестве бэкграунда на 100% страницы

Автор: Nau 28.9.2007, 11:36

Проблема воткнуть флэш так чтобы она прижималась к низу страницы.

Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="/css/main.css" media="screen" type="text/css" />
<title>Home</title>
</head>
<body>
<div id="main">...</div>
<div id="bot">
<object align="bottom" id="fon" width="100%" height="100%"> 
        <param name="wmode" value="opaque" />
        <embed align="bottom" id="fon" src="/swf/home.swf" wmode="opaque" width="100%" height="100%" />
</object>
</div>
</body>
</html>

с css:

Код


div#main {position: relative; z-index:2;}
div#bot  {position: absolute; bottom:0; right:0;}
div#bot object,div#bot embed{position:fixed; bottom:0; right:0; margin:0; padding:0; border:0;}
div#bot object#fon{z-index:1;}

флэшка естественно растягивается на 100% окна браузера, но не страницы, притом только в Опере,Ie7 и фоксе, но никак не в ie6 который fixed вообще не знает, в нём она становится 100% рамки браузера и крепится к верху body,т.е. при скроле вниз исчезает.

Но нужно чтобы флэшка заняла весь body.

Если изменить position:

Код


div#main {position: relative; z-index:2;}
div#bot  {position: absolute; bottom:0; right:0;}
div#bot object,div#bot embed{position:absolute; bottom:0; right:0; margin:0; padding:0; border:0;}
div#bot object#fon{z-index:1;}

тогда флэшка исчезает.(видимо процентные значения не действуют)

пробовал и #main делать absolute, а #bot relative, но тоже ничего не вышло.
(минимально хочется добиться, чтобы флэшка хотя бы располагалась в правом нижнем углу body)

Автор: Тутанхамец 28.9.2007, 12:42

Так на всю страницу или в нижнем правом? Насчет в нижнем правом не знаю, но чтоб в ie6 не прокручивался фон:

Код


<div style="background-attachment: fixed;"></div>

Автор: Nau 28.9.2007, 13:12

на всю не получится из-за свойств object-а: height и width они вычисляются от ширины и высоты окна броузера (
можно javascript-ом в пикселах сделать через screen.width?

если растянится на 100% будет супер, а вообще хватит и фиксированного в правом нижнем углу.(что тоже проблематично, у меня почему-то флэшка продолжает позиционироватся впритык нижней рамки браузера, но никак ни к body)

Автор: Тутанхамец 28.9.2007, 13:38

Может его в тэйбл и по центру? Или тэйбл (на 100%) с четырьмя ячейками, каждая из которых height: 25% и width: 25%, и в правую нижнюю забубонить твое swf? Ну можно конечно ячейки брать разного размера.

Автор: WebDisaster 28.9.2007, 14:00

Цитата(Nau @ 28.9.2007, 13:12

)

почему-то флэшка продолжает позиционироватся впритык нижней рамки браузера, но никак ни к body)

Если я правильно понял проблему (что совсем не факт), нужно задать body {position: relative;}. А у Вас позиционирование идёт от html.

Автор: SelenIT 28.9.2007, 17:04

В дополнение к ответу WebDisasterа (я понял проблему так же): в IE растянуть с помощью top:0; bottom:0; не получится. Единственный известный мне выход - задать высоту через expression(document.body.scrollHeight).