Прокрутка фона
Здравствуйте кодеры. Мне нужна помощь.
У меня есть фоновая картинка. Мне нужно сделать что бы при прокрутки страницы фон двигался с верху до низу и все. Ну типо как в пуске windows 8. Короче: заходишь на страницу, оно показывает верхнюю чать фона, а когда прокручиваешь вниз, не смотря на размен страницы, фон прокручивался только до нижней части Надеюсь вы поняли -_- |
yyyyuriyyyy,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<style type="text/css">
body{
height: 800px
}
</style>
</head>
<body>
<img alt="" src="http://pulson.ru/wp-content/uploads/2011/05/1286214958_94-695x990.jpg" id="bg" style="position:fixed; left:0%; top:0%; width:100%; z-index:-10" />
<script>
window.onload = function()
{
var height = window.innerHeight; //Высота экрана пользователя
var scrollHeight = document.documentElement.scrollHeight;
var clientHeight = document.documentElement.clientHeight;
var scrollHeight = Math.max(scrollHeight, clientHeight); //Высота всей страницы
var bg = document.getElementById('bg');
var bgHeight = bg.height; //Высота изображения
window.onscroll = function()
{
var a = window.pageYOffset || document.documentElement.scrollTop;; //Получаем при каждой прокуртке позицию скроллинга
bg.style.top = -(bgHeight - height)*(a/(scrollHeight-height)) +"px"
}
window.onresize = function()
{
height = window.innerHeight; //Высота экрана пользователя
scrollHeight = document.documentElement.scrollHeight;
clientHeight = document.documentElement.clientHeight;
scrollHeight = Math.max(scrollHeight, clientHeight); //Высота всей страницы
bgHeight = bg.height; //Высота изображения
window.onscroll()
}
}
</script>
</body>
</html>
|
Спасибо, большое спасибо
|
| Часовой пояс GMT +3, время: 10:47. |