helgajijka,
[HTML run height=700][/HTML]
и что в паралаксе неустраивает?
<!DOCTYPE HTML>
<html>
<head>
<title>Template</title>
<meta charset="utf-8">
<style type="text/css">
html, body{
height: 100%;
margin: 0px;
padding: 0px;
}
.header{
position: relative;
height: 620px;
background-image: url("http://javascript.ru/forum/images/ca_serenity/misc/logo.gif");
background-repeat: no-repeat;
background-size: cover;
background-position: 50% 50%;
}
.section-form{
background: url("../images/section-form-bg.jpg") 50% 50% no-repeat;
background-size: cover;
background-attachment: fixed;
}
div{
background-position: 50% 50%;
height: 100%;
width: calc(100%-12px);
border: rgb(102, 0, 255) 1px solid ;
background-size: cover;
}
div:nth-of-type(1) {
background-image: url(http://www.unitrade-bg.com/userfiles/image/alps/lake-mountain-the-alps_1600x1200_92573.jpg);
}
div:nth-of-type(2) {
background-image: url(http://cdn.dipity.com/uploads/events/0ff5b92dffa076352a2370a741f5e54f_1M.png);
}
div:nth-of-type(3) {
background-image: url(http://usiter.com/uploads/20101010/gory_priroda_9570.jpg);
}
div:nth-of-type(4) {
background-image: url(http://www.krasfun.ru/images/2014/2/f7561_original.jpg);
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
$(window).scroll(function(){
var windowScrollTop = $(this).scrollTop(),
header= $('.header');
if(windowScrollTop>header.position().top){
var scrollValue = 50 - (windowScrollTop*7-header.position().top)/100;
header.css({'background-position': '50% '+scrollValue+'%'});
}else{
header.css({'background-position': '50% 50%'});
}
if(windowScrollTop>header.next().position().top){
header.css({'background-position': '50% 50%'});
}
});
});
</script>
</head>
<body>
<header class="header paralax"></header>
<div class="section-promo-block1"></div>
<div class="section-promo-block2"></div>
<div class="section-form paralax"></div>
<div class="section-promo-block3"></div>
<footer></footer>
</body>
</html>