2

私はこれを現在の場所に到達させるのに十分なほどここで遊んできましたが、ハードルを乗り越えるために少し助けが必要です...私が思うすべての人のように！

リンク（.clickable）をクリックすると、幅がspan3からspan6に変わるようにしようとしています。

.clickableリンクは、クラスを変更する必要があるdiv内にあります。.blockは、アイテムセレクターのアイソトープで使用しているものです。

リンク：

<a class="clickable" href="#enlarge-article"><i class="icon-fullscreen"></i>&nbsp;&nbsp;<strong>Enlarge</strong></a>

Javascript：

var $container = $('#portfolio');   
$container.delegate( '.block', 'click', function(){
      $(".block").removeClass('span3').addClass('span6').siblings().removeClass('span6').addClass('span3');
  $container.isotope('reLayout');
});

更新されたクラスのタイプミス-現在.jsに表示されているとおりです

4

2 に答える 2

2

ハンドラーは.clikable要素用であるとおっしゃいました。

.on() 代わりに使用する.delegate()

これを試して

var $container = $('#portfolio');   
$container.on( 'click','.clickable', function(e){
    e.preventDefault();
    // If you want to affect all the .block divs
    $(".block").removeClass('span6').addClass('span3');
    // If you want to affect only the block in which the anchor was clicked
    //$(this).closest('.block').removeClass('span6').addClass('span3');
    $(this).removeClass('span3').addClass('span6');
    $container.isotope('reLayout');
});
于 2012-11-01T00:17:10.650 に答える
1

これを試して：

var $container = $('#portfolio');   
$container.delegate( '.block', 'click', function(){
    $(".block").removeClass('span6').addClass('span3');
    $(this).removeClass('span3').addClass('span6');
    $container.isotope('reLayout');
});
于 2012-11-01T00:07:36.133 に答える