2012-02-19 6 views
1

JQueryには少し新しく、関連する別のコンテンツを同じコンテナに開く複数のリンクを用意しようとしています。別のdivコンテンツを同じコンテナjqueryに開きます

JSFiddle

+0

この例では何をしたいのですか? – uday

+0

リンク1をクリックすると、コンテンツ1がコンテナに読み込まれ、リンク2をクリックしてコンテンツがコンテンツ2に置き換えられます。 –

答えて

1

あなたはそれを行うにはHTML5のdata-* synatxを使用することができます。

HTML:

<a class="link" data-link="first" href="#">link 1</a> 
<a class="link" data-link="second" href="#">link 2</a> 
<a class="link" data-link="third" href="#">link 3</a> 

<div class="linkdetails" data-link="first" >content 1</div> 
<div class="linkdetails" data-link="second" >content 2</div> 
<div class="linkdetails" data-link="third" >content 3</div> 
​ 

Javascriptを:

$('.link').toggle(function() { 
    $('.linkdetails[data-link=' + $(this).data('link') + ']').animate({ 
     width: '200px' 
    }, 300); 


}, function() { 
    $('.linkdetails[data-link=' + $(this).data('link') +']').animate({ 
     width: '0px' 
    }, 300); 

});​ 

JSFiddle DEMO

+0

これはほとんど私の後だったので、関連するコンテンツを置き換えるだけで新しい容器 –

+0

これを使用して問題を解決しました。[JSfiddle](http://jsfiddle.net/unbornink/LUKGt/) –

+0

@ChrisMead。いい感じ。がんばろう! – gdoron

関連する問題