2012-01-20 12 views
2

私はここのコードだ、Zoomer.jsでアニメーション機能のためのJSを編集しようとしました:このjQueryアニメーション機能をボトムツートップで動作させるにはどうすればよいですか?

$('.title').animate({marginLeft:'2px',marginTop:'65px'},d.speedTitle).css({'z-index':'10','position':'absolute','float':'none'})}}},function(){$(this).css({'z-index':'0'}); 
$(this).find('img').removeClass("hover").stop().animate({marginTop:'0',marginLeft:'0',top:'0',left:'0',width:'100px',height:'100px',padding:'0px'},d.speedRemove);$(this).find('.title').remove()})}}})(jQuery); 

私は下からではなく、上からアニメーション化する小さな赤い箱のための希望下。 marginTop: '65px'をmarginBottom: '35px'に変更するのと同じくらい簡単だと思ったが、これはやっていない。

私はposition:absoluteレンダリングを使ってmarginBottomを無効にしましたが、私が他の位置を使用すると、エフェクトが壊れます。これが正しければ、回避策はありますか?これが間違っていたら、どこが間違っているのか教えてください。

誰もが時間と入力を感謝します。

ありがとうございました!

+1

あなたは 'bottom'プロパティをアニメーション化しようとしましたか? –

+1

@FrédéricHamidi - フィドルを弄っていて、それはうまくいきます。あなたは答えとして投稿する必要があります:http://jsfiddle.net/JTyVV/ – karim79

+1

@karim、完了、ありがとう:) –

答えて

2

あなたの要素が絶対的に配置されているので、あなたはそのbottomプロパティをアニメーション化することができますが:

$(".title").animate({ 
    marginLeft: "2px", 
    bottom: "35px" 
}, d.speedTitle); 
+0

ありがとうございました!私はそれがフィドルでうまく動作するのがわかりますが、サイトにプラグインすると正しく動作しません。私はそれがjCarouselと一緒に働くこのズームプラグインといくつかのワイヤーが交差しているためだと思う。 (あなたは[here](http://www.remotereplacer.com)を見ることができます) – entrprnr

+0

2つのプラグインの一方または両方があなたの要素に 'top' CSSプロパティを設定しています。私たちの「ボトム」の使用。 –

+0

私の周りつついてきた&犯人を見つけることができません - しかし、任意のレートであなたの助けをありがとう... 奇妙なことは、それが今、下から上へIEでのアニメーション化ですが、上から下でFF LOL – entrprnr

関連する問題