2012-04-10 9 views
2

divを右から左にスライドさせ、閉じるオプションを開きます(右にスライドします)Jqueryコンテンツを右から読み込む

例: http://www.cortac.com/

これを達成するためのアイデア、デモリンクなどはありますか?

これは上記に近いが、右から左にスライドしないことがわかった。

http://d2o0t5hpnwv4c1.cloudfront.net/011_jQuerySite/sample/index.html

+0

を見てきました[jQueryの - 右から左にスライドさ?](http://stackoverflow.com/questions/596608/jquery-slide-right-to-left) –

答えて

2

私はここで非常に簡単な例を作った:http://jsfiddle.net/jaketoolson/ukztv/

を私は幅に負の等しい右のセットで絶対位置にパネルを設定します。

#page { 
position: absolute; 
top: 20%; 
right: -400px; 
width: 400px; 
} 

次にjQueryのマウスオーバー(ETCクリックを使用)「アニメイト」で効果ターゲットCSSを設定している:

$('.link').mouseover(function() { 
$('#page').animate({'right':'0px'}, 1500); 
}).mouseout(function(){ 
$('#page').animate({'right': '-800px'}, 1500);}); 

それはページをロードするために取得するには、これは、AJAXを介して、または他の行うことができますメソッド。もう少しあなたが求めてきたものよりも複雑であるが、それのような唯一の事...

+0

ありがとう、ジェイク、それを感謝します。 –

+0

私が追加したEMSリンクのjQueryを見ると、読み込まれたときに「ブック」がスライド(開いた状態)になり、ブックの外側のどこかをクリックするとスライドして表示されます(閉じます)。 2つのタグのいずれかをクリックすると、そのページがAJAX経由で読み込まれ、タグcssが更新されます。 –