Javascript 在2个jquery实例之间切换
我有两个jquery实例,它们相互“交换”元素。这是可行的,但出于某种原因,我得到了jquery同位素之间的空间。有人知道我如何删除这些空白以便同位素正确排列吗。我做了一个JSFIDLE: 干杯Javascript 在2个jquery实例之间切换,javascript,jquery,jquery-isotope,Javascript,Jquery,Jquery Isotope,我有两个jquery实例,它们相互“交换”元素。这是可行的,但出于某种原因,我得到了jquery同位素之间的空间。有人知道我如何删除这些空白以便同位素正确排列吗。我做了一个JSFIDLE: 干杯 var $container = $('#product-masonry'); var $trash = $('#trash-masonry'); $container.isotope({ itemSelector: '.item', }); $trash.isotope({ item
var $container = $('#product-masonry');
var $trash = $('#trash-masonry');
$container.isotope({
itemSelector: '.item',
});
$trash.isotope({
itemSelector: '.item',
});
// remove item if clicked
$container.delegate( '.remove', 'click', function(){
var remove_id = $(this).data('item');
$trash.isotope( 'insert',$('#' + remove_id) );
});
$trash.delegate( '.remove', 'click', function(){
var remove_id = $(this).data('item');
$container.isotope( 'insert',$('#' + remove_id) );
});
我在jquery同位素插件中创建了两个新函数:
throwaway : function( $content, callback ) {
// remove elements immediately from Isotope instance
this.$allAtoms = this.$allAtoms.not( $content );
this.$filteredAtoms = this.$filteredAtoms.not( $content );
// remove() as a callback, for after transition / animation
var instance = this;
var removeContent = function() {
$('#trash-masonry').append( $content ).isotope( 'appended', $content );
setTimeout(function(){ $('#trash-masonry').isotope() }, 400);
setTimeout(function(){ $('#product-masonry').isotope() }, 400);
};
if ( $content.filter( ':not(.' + this.options.hiddenClass + ')' ).length ) {
// if any non-hidden content needs to be removed
this.styleQueue.push({ $el: $content, style: this.options.hiddenStyle });
this._sort();
this.reLayout( removeContent );
} else {
// remove it now
removeContent();
}
},
putback : function( $content, callback ) {
// remove elements immediately from Isotope instance
this.$allAtoms = this.$allAtoms.not( $content );
this.$filteredAtoms = this.$filteredAtoms.not( $content );
// remove() as a callback, for after transition / animation
var instance = this;
var removeContent = function() {
$('#product-masonry').append( $content ).isotope( 'appended', $content );
setTimeout(function(){ $('#trash-masonry').isotope() }, 400);
setTimeout(function(){ $('#product-masonry').isotope() }, 400);
};
if ( $content.filter( ':not(.' + this.options.hiddenClass + ')' ).length ) {
// if any non-hidden content needs to be removed
this.styleQueue.push({ $el: $content, style: this.options.hiddenStyle });
this._sort();
this.reLayout( removeContent );
} else {
// remove it now
removeContent();
}
},
及
工作就像一个符咒:)
$container.delegate( '.remove', 'click', function(){
var remove_id = $(this).data('item');
$container.isotope( 'throwaway',$('#' + remove_id) );
});
$trash.delegate( '.remove', 'click', function(){
var remove_id = $(this).data('item');
$trash.isotope( 'putback',$('#' + remove_id) );
});