Hello Readers !
Here is an example of parallax scrolling with simple script and it is also compatible with internet explorer.
Parallax Scrolling :-
The parallax scrolling web design is in trend, Its shows the background moving at a slower compared to foreground and its shows a 3D effect when you scroll the page.
Script :-
$(document).ready(function() {
$(window).bind('scroll',function(){
parallax();
})
})
function parallax(){
var scrollposition=$(window).scrollTop();
$('.ground').css('top',(0 - (scrollposition * .1))+'px')
$('.box').css('top',(0 + (scrollposition * 1.2))+'px')
}
Html
<div class="main">
<div class="ground"></div>
<div class="box"></div>
</div>
0 Comment(s)