изотоп добавить закрыть кнопку

Question

изотоп добавить закрыть кнопку

0

онлайн-образец http://jsfiddle.net/QxdXW/ Я пытаюсь добавить кнопку закрытия, чтобы удалить выбранный класс, но не могу получить ожидаемый результат. Я хотел, чтобы кнопка закрытия удаляла selected и возвращалась к нормальному размеру ящика. также хотел закрыть текущий красный ящик после следующего запуска

HTML

<div class="item"><div class="close">X</div></div>

jQuery var $ close = $ ('. close');

$close.click(function(){
var $this = $(this);
   $(this).parents('.item').removeClass('selected');

});

olo 29 март 2014, в 08:56

Источник

Теги:

javascript

jquery

jquery-isotope

1 ответ

Ещё вопросы

Devima · Accepted Answer · 2014-03-29T12-08-00.000Z

Я не знаю, подходит ли это решение вашим потребностям, но это моя скрипка

    $(function(){
    var $container = $('#container'), $items = $('.item');
    var $close = $('.close');
    $close.hide()
   $(document).on('click', '.close', function(e) {
      $(this).parent('div').toggleClass('selected')
      $close.hide()
      $container.isotope('reLayout')
    });

  $container.isotope({
    itemSelector: '.item',
    masonry: {
      columnWidth: 60
    },
    getSortData : {
      selected : function( $item ){
        return ($item.hasClass('selected') ? -1000 : 0 ) + $item.index();
      }
    },
    sortBy : 'selected'
  })
  $items.click(function(){
    var $this = $(this);
    var cla=$this.attr('class')
       if(cla==="item isotope-item"){
          var what=$container.find('div.selected').attr('id')
          $('#'+what).removeClass('selected')
          $(this).addClass('selected')
          $close.show()
          $container
          .isotope( 'updateSortData', $this )
          .isotope()          
       }
  });
});

HTML:

<div id="container">
   <div class="item" id="a"><div class="close">X</div></div>
  <div class="item" id="b"><div class="close">X</div></div>
  <div class="item" id="c"><div class="close">X</div></div>
  <div class="item" id="d"><div class="close">X</div></div>
  <div class="item" id="e"><div class="close">X</div></div>
  <div class="item" id="f"><div class="close">X</div></div>
  <div class="item" id="g"><div class="close">X</div></div>
  <div class="item" id="h"><div class="close">X</div></div>
  <div class="item" id="i"><div class="close">X</div></div>
  <div class="item" id="l"><div class="close">X</div></div>
  <div class="item" id="m"><div class="close">X</div></div>
  <div class="item" id="n"><div class="close">X</div></div>
  <div class="item" id="o"><div class="close">X</div></div>
  <div class="item" id="p"><div class="close">X</div></div>
  <div class="item" id="q"><div class="close">X</div></div>
  <div class="item" id="r"><div class="close">X</div></div>
</div>

Я не знаю этого плагина, поэтому я не знаю, была ли ваша цель получить это.
Если я ошибаюсь, я сожалею о вашей потере времени