2011-09-16 8 views
0

jqueryエフェクトをhtmlリンクと組み合わせて使用​​しようとしています: リンクをクリックすると、マスターページにある特定のdivが表示されます。必要なページに、以下のノー成功でこれを達成するために使用していたコードは次のようになりますjqueryの効果が働いているが、ページは、falseを返すことで、サービスのページHtmlリンクがjqueryエフェクトと連動しない

+0

'とは何ですか?オープニングタグはどこにも表示されません。これはあなたの問題である可能性があります。 –

+0

私はそれを削除しました、ごめんなさい –

答えて

4

に移動されていない

<script type="text/javascript"> 
$(document).ready(function() { 

$('#services-sub-menu').hide(); 
    $('#services').click(function() { 
    $('#services-sub-menu').show("slow"); 
    return false; 
     }); 

}); 
<div class="Menu2"><a href="/articles" id="articles">ARTICLES</a><br /> <a href="/services" id="services">TESTIMONIALS</a><br /><a href="#" id="contact">CONTACT US</a></div> 
</div><div class="sub-menu"> 
    <div id="services-sub-menu"><a href="/services-submenu" /></div> 

</div> 

あなたのクリックが終わったら、基本的にブラウザにデフォルト動作を停止するように指示します。

このjQueryのequivelentは次のようになります。

期待どおりanmiationが完了する前にリダイレクトすることがあなたの return falseを削除

$('#services').click(function (event) { 

リンクが動作するようになります

event.preventDefault(); 

あなたができることは、showメソッドにコールバックを追加し、そこでJavascriptを使用してリダイレクトすることです。あなたのjavascriptからライン

return false; 

を削除http://jsfiddle.net/XakkU/

<a href="http://www.google.com" id="clicker">Click me </a> 
<div id="showMe">Hold on, we're taking off!</div> 

$('#clicker').click(function(event){ 
    $('#showMe').show('slow',function(){ 
     window.location.replace($('#clicker').attr('href')); 
    }); 
    event.preventDefault(); 
}); 
+0

あなたは最も簡単な例を提供できますか? –

+0

私の更新を見てください。 –

+0

thnx今私はそれを試してみます –

2

$('#services-sub-menu').show("slow",function(){ 
    // Stuff that will happen when animation has completed 
    window.location.replace(redirectionUrl); 
}); 

更新

はここで非常に基本的な作業例です。これにより、クリックの処理がさらに妨げられ、リンクが機能しなくなります。

+0

私はライディングの上でいくつかのCSSを防ぐためにfalseを返す必要があります –

+0

あなたの最善の策は、 Jamieがアドバイスしたように、エフェクトと一緒にコールバック関数を使用します。 – Andrei

関連する問題