jquery - Firefox, position fixed, scroll bar -

in example if animate div red makes strange movement right. think problem comes firefox, div right, there scroll bar , position fixed.

(if use position absolute solve movement. if user scrolls, div moves, , should "fixed" right, bottom)

• firefox
• right
• scroll bar
• fixed position

please check here: http://jsfiddle.net/lhaeh/1/

html:

<div id="blue"></div> <div id="red"></div> 

css:

#red {     position: fixed; /* fixed genera el problema */      bottom: 20px; right:25px;     width:80px; height:50px;     cursor:pointer;      background:red; }  #blue {     margin:0 auto;     width:80px; height:500px;     background:blue; } 

jquery:

$(function(){        $("#red").click(function() {         $("#red").animate({bottom:'-80px'},1000);     });  }) 

• image 1: original position
• image 2: when clicks moves right , down. should moves down

it looks workaround found, change fixed box's position absolute , put inside fixed position div: css fixed position movement under scrollbar in firefox

also, there open bug on issue: css position fixed no longer factors in scrollbar after hover

update: better workaround found, use min-width instead of width fixed box: https://stackoverflow.com/a/15705522/980692