CODEWITHSUNDEEP
jquery
asdasd asda
asdasd asda

Reputation: 65

jQuery slide down div from top when scroll over other div

I use this code and its working : 

$(function(){
    $(window).scroll(function() { 
        if ($(this).scrollTop() > 370) {

            $(".userbar").css({
                'position':'fixed',
                'top':'-41px',
                'right':'157px',
                'z-index':'2000',
                'message':''
            });   
              $(".userbar").slideDown();
        } 
        else {     
             $(".userbar").css({
                'position':'relative',
                'margin-top':'40px',
                'margin-left':'39px',
                'top':'0',
                'right':'0'

            });   
        }  

    });

When i reach to 370 pixel from top its should move the exsiting div from position relative to fixed .

its working good but this is not what i want I want the same div will slide down when i scroll over other div , how to do this ?

Upvotes: 1

Views: 1594

Answers (1)

thenewseattle
thenewseattle

Reputation: 1451

use display: none; instead of using the position:relative parameter. Then slide the div depending on the scroll distance.

http://jsfiddle.net/smL6Q/1/

.userbar
{
    width: 50px;
    height: 50px;
    background: red;
    display: none;
    position: fixed;
}

$(window).scroll(function() { 
    if ($(this).scrollTop() < 370)
    {
        $(".userbar").slideUp();   
    } 
    else
    {     
        $(".userbar").slideDown();
    }
});

Upvotes: 2

Related Questions