jquery - jQuery: ホバーオーバー スライド パネル

Question

Google 検索と同様に、ウェブサイトの特定の画像にカーソルを合わせたときにスライド アウト パネルを表示する方法を探しています。

別の Web サイト ページを表示するには、このパネルも必要です。iframeまたはPHPのcURLを使用して実行できると確信しています。

これは私が探しているものに似た例です: http://srobbin.com/jquery-plugins/pageslide/

Answer 1

とても簡単です。プラグインは必要ありません。

HTML

<img id="imgHover" src="img/photo.png"/>
<div id="panel">
    <iframe src="http://www.website.com"></iframe>
</div>

Jクエリ

$("#panel").hide();
$("#imgHover").hover(
    function(){
        $("#panel").slideDown();
    },
    function(){
        $("div").slideUp();
    }   
)

作業例:

http://jsfiddle.net/kirkas/SULhT/

アップデート

http://jsfiddle.net/kirkas/aFXNC/

Answer 2

それはあなたが言及したものとかなり似ていますが、モザイクに見えましたか?

http://buildinternet.com/project/mosaic/1.0/