0
Я делаю эффект прокрутки Pallarax на веб-сайте. Если я ставлю 3 или более section, эффект полностью неправильный ... С 2 section это работает отлично. В чем проблема?Parallax Scrolling работает только с несколькими разделами
Может видеть й эффект здесь: http://www.alsite.com.br/parallax
И JSFIddle здесь: http://jsfiddle.net/JnncN/
я помещал некоторый цвет на фоне, чтобы увидеть ошибку. Изображение должно быть заполнено, как и первые 2 раздела.
Мой HTML:
<body>
<section id="home" data-speed="10" data-type="background">
<article>I am Absolute Positioned</article>
</section>
<section id="produtos" data-speed="4" data-type="background">
<article>I am Absolute Positioned</article>
</section>
<section id="empresa" data-speed="3" data-type="background">
<article>I am Absolute Positioned</article>
</section>
<section id="contato" data-speed="6" data-type="background">
<article>I am Absolute Positioned</article>
</section>
</body>
Сценарий:
$(document).ready(function(){
$window = $(window);
$('section[data-type="background"]').each(function(){
var $bgobj = $(this); // assigning the object
$(window).scroll(function() {
// Scroll the background at var speed
// the yPos is a negative value because we're scrolling it UP!
var yPos = -($window.scrollTop()/$bgobj.data('speed'));
// Put together our final background position
var coords = '50% '+ yPos + 'px';
// Move the background
$bgobj.css({ backgroundPosition: coords });
}); // window scroll Ends
});
});
не изменился .. с цветами правильно, но когда я положил фоновые изображения, происходит то же самое проблема ... – Preston