2012-05-08 16 views
1

こんにちは、私は画面の側面を隠すナビゲーションメニューを持っています。残念ながら、アンカーリンクをクリックすることはできません(代わりにトグルします。デフォルトを防ぐオーバーライドして、リンクがnav要素の内側にあると仮定すると、その要素に設定されたアニメーションをトリガーする?Jquery toggle override preventdefault

$('a', 'nav').on('click', function(e) { 
    e.stopPropagation(); 
}); 

var one = {queue:true, duration:1250, easing: 'easeInOutExpo'}; 
var two = {queue:true, duration:1500, easing: 'easeInOutExpo'}; 

$('nav').toggle(
function() { showMenu() }, 
function() { hideMenu() }); 

$(window).bind('load', function() { 
setTimeout ('hideMenu()', 1000); 
}); 

function hideMenu() 
{ 
$('nav').animate({ left: '-=270' }, one); 
$('#container').animate({ left: '-=270' }, two); 
} 
function showMenu() 
{ 
$('nav').animate({ left: '+=270' }, one); 
$('#container').animate({ left: '+=270' }, two); 
} 

答えて

1

作業アンカータグを取得することからアンカーをクリックして停止しますまで泡立つ要素。アンカーはそれを動作させるために

0

あなたはものがあること

$('a.optional-class').click(function(e){ 
    e.preventDefault(); // it's way more powerful than... 
    // your code goes here 
    return false; // ... than this 
}); 

よう.click()上のデフォルトの動作を妨げる空でないhref属性を提供している必要があり、その上でハックの両方(?)の作品異なる方法で、 1).preventDefault()は、このアンカーが実際にはアンカーではなく、1つとして扱われるべきではないことを単にブラウザに伝えます。 ANYを防ぐ<a />アクション 2)return falseは、ユーザーが実際にリンクをクリックしていないことをブラウザに伝えます。これはは `e.preventDefault()` `false`を返すよりも、より強力な方法である理由

<a href="#some_id_here"> 
<!-- some code and height goes here... --> 
<div id="some_id_here"></div> 
+0

はあなたが説明してくださいすることができれば、サイトをスクロールから防ぐことはできませんか? – adeneo

+0

さて、私は間違っていたようです。 jQueryでは 'return false' **は' e.preventDefault() 'と' e.stopPropagation() 'を呼び出すために**等しいです。しかし、バニラJSの場合、 'return false'は' e.preventDefault() 'だけをトリガします。そのため、イベントはまだDOMツリーをバブルアップします。 ソース:http://stackoverflow.com/questions/1357118/event-preventdefault-vs-return-false – meeDamian