スライドを左にスライドさせ、親のホバーで右にスライドして内容を表示し続ける

Question

親要素のマウスオーバー（またはマウスオーバー）時にスライドするメニューシステムを作成しようとしていますが、スライドアウトは、ユーザーのためのオプションメニューを含むため、アクセス可能です。

私のHTMLは、

<div id="sidebarDiv"> 

    <div id="slidemenuDiv"> 

    cont here must be accessible 

    </div> 

</div> 

私はややこのスレッド内の溶液を見つけた：HEREが、これはスライドアップのためのものであり、シナリオを下にスライドさせます。また、アニメーションが少しバギーだったことに気がつきました - いくつかのマウスオーバー/マウスアウトイベントの後、内側のdiv要素の高さが変わり、ページをリフレッシュしてリセットする必要があります。

私はまた、http://docs.jquery.com/UI/Effects/Slideにあるコードを適応させようとしています。

私はどこから見えるでしょうか？または、次のコードをスライドの左と右のスライドで動作させる方法。

$("#slidemenuDiv").hide(); 
$('#sidebarDiv').hoverIntent(function() { 

    $("#slidemenuDiv").stop().slideDown('slow'); 

}, 
function() { 
    // I don't want the div to hide if user hovers over it 
    $("#slidemenuDiv").stop().fadeOut('slow'); 
}); 

ここでは、私がよりよく達成しようとしていることを説明するイメージの例を示します。

http://img850.imageshack.us/img850/460/unled1xw.jpg

あなた W

UPDATEありがとう：私は、次の作業を取得するために管理

を。

$("#slidemenuDiv").stop().hide(); 
$("#sidebarDiv").hoverIntent(
     function() { 
      $("#slidemenuDiv").stop().show("slide", { direction: "right" }, 1000); 
     }, 
     function() { 
      $("#slidemenuDiv").stop().hide("slide", { direction: "right" }, 1000); 
     } 
); 

しかし、私は次のことを含める必要があります。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script> 
<script type="text/javascript" src="http://cherne.net/brian/resources/jquery.hoverIntent.js"></script> 
<script src="http://ui.jquery.com/latest/ui/jquery.effects.core.js"></script> 
<script src="http://ui.jquery.com/latest/ui/jquery.effects.slide.js"></script> 

単純なスライドのためにたくさんの雑誌のように見えますが、slideRightシナリオですか？

Answer 1

あなたが正確に何を望んでいるかはっきりしません。

しかし、あなたは、あなたが何か行うことができませんでし掲載スクリプトから：

$("#slidemenuDiv").hide(); 

$('#sidebarDiv').hoverIntent(
     function() { 
      $("#slidemenuDiv").stop().animate({ left: '-=50'}); 
     }, 
     function() { 
      $("#slidemenuDiv").stop().animate({ left: '+=50'}); 
     } 
);