0

左からこのウェブサイトのスライドのようなjqueryメニューを作成し、アイコンをクリックすると元の位置に戻ります。

http://wittlingerorthodontics.com/default2.asp

jsFiddleでのみこれを達成できます

http://jsfiddle.net/messi1987/tfASa/

$(function() {
// run the currently selected effect
function runEffect() {
// get effect type from
var selectedEffect = "slide";

// most effect types need no options passed by default
var options = {};
// run the effect
$( "#effect" ).effect( selectedEffect, options, 1000 );
};

// set effect from select menu value
$( "#button" ).click(function() {
runEffect();
return false;
});
});

私はそれをスライドさせたいのですが、クリックするとボタン/画像がスライドして元の位置に戻ります。jquery は初めてなので、ヘルプ コンテンツはどこにもありません。これを行うのを手伝ってください。完全に理解するには、参照先の Web サイトを確認してください。

4

1 に答える 1

3

このフィドルを試してみてください、これがあなたが望むものだと思います

$(function() {
    $('#button').click(function(){
         $(".ul_menu").toggleClass('show');
        if( $(".ul_menu").hasClass('show')){
        $(".ul_menu").show("slide",{direction: 'left'});
        }else{
          $(".ul_menu").hide("slide",{direction: 'left'});
        }
    });
    $('#button').mouseleave(function(){
        if($(".ul_menu").hasClass('show')){
           $(".ul_menu").hide("slide",{direction: 'left'});
        }
    })
});
于 2013-10-01T06:21:23.790 に答える