Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Example of Parallax Scrolling

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 401
    Comment on it

    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)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: