0

こんにちは、私はすでにjqueryに基づいて私のサイトにmovile固定メニューを実装していますが、各文の内部のmarginTopとmarginBottomに少し問題があります.marginBottomが機能していません。

実際の例: http://www.utxj.edu.mx/menu_example/index.html

私のコード...

$(document).ready(function(){
    $(function() {
            var d=300;

            $('#navigation a').each(function(){
                $(this).stop().animate({
                    'marginTop':'-80px'
                },d+=150);
            });

            $('#navigation > li').hover(function () {
                $('a',$(this)).stop().animate({
                    'marginTop':'-2px'
                },200);
            }, function () {
                $('a',$(this)).stop().animate({
                    'marginTop':'-80px'
                },200);
            }
        );
    });
});

$(document).ready(function(){
    $(function() {
            var d=300;

            $('#navigation2 a').each(function(){
                $(this).stop().animate({
                    'marginBottom':'-80px'
                },d+=150);
            });

            $('#navigation2 > li').hover(function () {
                $('a',$(this)).stop().animate({
                    'marginBottom':'-2px'
                },200);
            }, function () {
                $('a',$(this)).stop().animate({
                    'marginBottom':'-80px'
                },200);
            }
        );
    });
});

Tnx 4 ヘルプ。

4

1 に答える 1

1

マージンは、本来あるべきことを行っています。要素はアニメーション ブロックの新しいサイズに合わせて拡大し、残りの要素も一緒にドラッグします。

解決策として、要素relativeを現在の位置に配置し、それらtopとbottomプロパティをアニメーション化してみてください。

li {
  position: relative;
}
于 2012-06-12T03:54:12.200 に答える