1

この例では、赤の div をアニメーション化すると、右に奇妙な動きをします。問題が発生するのは Firefox だけだと思います。div は正しく、スクロール バーと位置は固定されています。

(絶対位置を使用すると、動きを解決します。ただし、ユーザーがスクロールすると、divが移動し、右、下に「固定」される必要があります)

  • ファイアフォックス
  • スクロール・バー
  • 固定位置

ここで確認してください: 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;
}

Jクエリ:

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

元の位置 クリック後

  • 画像 1: 元の位置

  • 画像 2: 誰かがクリックすると、右に移動してから下に移動します。下にしか動かないはず

4

3 に答える 3

0

これはあなたが探しているものですか?

デモ

.background{
    position:relative;
}

$(function(){       
    $("#red").click(function() {
        $("#red").animate({bottom:'15px'},1000);
        $("#red").css({"position":"absolute","right":"15px"});
    });     
})  
于 2013-05-20T09:45:18.880 に答える