diff --git a/_posts/docs/2010-12-04-methods.mdown b/_posts/docs/2010-12-04-methods.mdown index df21c13..89718c8 100644 --- a/_posts/docs/2010-12-04-methods.mdown +++ b/_posts/docs/2010-12-04-methods.mdown @@ -92,20 +92,13 @@ Positions specified item elements in layout. {% endhighlight %} -Modifies options for plugin instance. Can be used to get and set options. Unlike passing options through `.isotope()`, using the `option` method will not trigger layout. +Sets options for plugin instance. Unlike passing options through `.isotope()`, using the `option` method will not trigger layout. {% highlight javascript %} // sets multiple options .isotope( 'option', { layoutMode: 'fitRows', filter: '.my-filter' } ) -// set single option -.isotope( 'option', 'layoutMode', 'straightDown' ) - -// get option -.isotope( 'option', 'layoutMode' ) -// returns 'straightDown' - {% endhighlight %} diff --git a/_posts/docs/2010-12-11-troubleshooting.mdown b/_posts/docs/2010-12-11-help.mdown similarity index 94% rename from _posts/docs/2010-12-11-troubleshooting.mdown rename to _posts/docs/2010-12-11-help.mdown index ed9312c..7eb085b 100644 --- a/_posts/docs/2010-12-11-troubleshooting.mdown +++ b/_posts/docs/2010-12-11-help.mdown @@ -1,6 +1,6 @@ --- -title: Troubleshooting +title: Help category: docs layout: doc related: z-etc @@ -13,7 +13,6 @@ toc: - { title: @font-face fonts, anchor: fontface_fonts } - { title: CSS transforms in Opera, anchor: css_transforms_in_opera } - { title: Infinite Scroll with filtering or sorting, anchor: infinite_scroll_with_filtering_or_sorting} - - { title: Prepending items, anchor: prepending_items } - { title: Flash, anchor: flash } --- @@ -123,10 +122,6 @@ I recommend against using Infinite Scroll with filtering or sorting. This combin If you do plan on implementing Infinite Scroll with filtering or sorting (which is a _bad idea_), use the `insert` method instead of `appended`. -## Prepending items - -While there is no prepend method built into Isotope, you can add items to the beginning of a Isotope layout by using sorting and [`updateSortData`](methods.html#getsortdata). See [Isotope - prepending items on jsFiddle](http://jsfiddle.net/desandro/zXWkw/4/). - ## Flash [Using CSS transforms with Flash content is a bit buggy in Safari and Firefox](http://dropshado.ws/post/4085720152/css-transforms-breaking-flash). This is problematic when using Isotope on item elements that contain Flash content like YouTube or Vimeo videos, Flash ads, or Flash audio players. diff --git a/jquery.isotope.js b/jquery.isotope.js index 69a8e74..df9c89a 100644 --- a/jquery.isotope.js +++ b/jquery.isotope.js @@ -1,5 +1,5 @@ /** - * Isotope v1.3.110523 + * Isotope v1.3.110524 * An exquisite jQuery plugin for magical layouts * http://isotope.metafizzy.co * @@ -387,10 +387,8 @@ this.reloadItems(); // get top left position of where the bricks should be - var $cursor = $( document.createElement('div') ); - this.element.prepend( $cursor ); - this.posTop = Math.round( $cursor.position().top ); - this.posLeft = Math.round( $cursor.position().left ); + var $cursor = $( document.createElement('div') ).prependTo( this.element ); + this.offset = $cursor.position(); $cursor.remove(); // add isotope class first time around @@ -441,8 +439,7 @@ }, option: function( key, value ){ - // get/change options AFTER initialization: - + // change options AFTER initialization: // signature: $('#foo').bar({ cool:false }); if ( $.isPlainObject( key ) ){ this.options = $.extend(true, this.options, key); @@ -450,11 +447,6 @@ for ( optionName in key ) { this._updateOption( optionName ); } - - // signature: $('#foo').bar('option', 'baz', false); - } else { - this.options[ key ] = value; - this._updateOption( key ); } }, @@ -586,6 +578,8 @@ }, _pushPosition : function( $elem, x, y ) { + x += this.offset.left; + y += this.offset.top; var position = this.getPositionStyles( x, y ); this.styleQueue.push({ $el: $elem, style: position }); if ( this.options.itemPositionDataEnabled ) { @@ -813,7 +807,7 @@ var i = this.masonry.cols; this.masonry.colYs = []; while (i--) { - this.masonry.colYs.push( this.posTop ); + this.masonry.colYs.push( 0 ); } }, @@ -867,7 +861,7 @@ } // position the brick - x = this.masonry.columnWidth * shortCol + this.posLeft; + x = this.masonry.columnWidth * shortCol; y = minimumY; this._pushPosition( $brick, x, y ); @@ -879,7 +873,7 @@ }, _masonryGetContainerSize : function() { - var containerHeight = Math.max.apply( Math, this.masonry.colYs ) - this.posTop; + var containerHeight = Math.max.apply( Math, this.masonry.colYs ); return { height: containerHeight }; }, @@ -914,8 +908,8 @@ } // position the atom - x = instance.fitRows.x + instance.posLeft; - y = instance.fitRows.y + instance.posTop; + x = instance.fitRows.x; + y = instance.fitRows.y; instance._pushPosition( $this, x, y ); instance.fitRows.height = Math.max( instance.fitRows.y + atomH, instance.fitRows.height ); @@ -953,16 +947,16 @@ col = props.index % props.cols, row = ~~( props.index / props.cols ), x = ( col + 0.5 ) * props.columnWidth - - $this.outerWidth(true) / 2 + instance.posLeft, + $this.outerWidth(true) / 2, y = ( row + 0.5 ) * props.rowHeight - - $this.outerHeight(true) / 2 + instance.posTop; + $this.outerHeight(true) / 2; instance._pushPosition( $this, x, y ); props.index ++; }); }, _cellsByRowGetContainerSize : function() { - return { height : Math.ceil( this.$filteredAtoms.length / this.cellsByRow.cols ) * this.cellsByRow.rowHeight + this.posTop }; + return { height : Math.ceil( this.$filteredAtoms.length / this.cellsByRow.cols ) * this.cellsByRow.rowHeight + this.offset.top }; }, _cellsByRowResizeChanged : function() { @@ -981,15 +975,14 @@ _straightDownLayout : function( $elems ) { var instance = this; $elems.each( function( i ){ - var $this = $(this), - y = instance.straightDown.y + instance.posTop; - instance._pushPosition( $this, instance.posLeft, y ); + var $this = $(this); + instance._pushPosition( $this, 0, instance.straightDown.y ); instance.straightDown.y += $this.outerHeight(true); }); }, _straightDownGetContainerSize : function() { - return { height : this.straightDown.y + this.posTop }; + return { height : this.straightDown.y }; }, _straightDownResizeChanged : function() { @@ -1007,7 +1000,7 @@ var i = this.masonryHorizontal.rows; this.masonryHorizontal.rowXs = []; while (i--) { - this.masonryHorizontal.rowXs.push( this.posLeft ); + this.masonryHorizontal.rowXs.push( 0 ); } }, @@ -1060,7 +1053,7 @@ // position the brick x = minimumX; - y = this.masonryHorizontal.rowHeight * smallRow + this.posTop; + y = this.masonryHorizontal.rowHeight * smallRow; this._pushPosition( $brick, x, y ); // apply setHeight to necessary columns @@ -1071,7 +1064,7 @@ }, _masonryHorizontalGetContainerSize : function() { - var containerWidth = Math.max.apply( Math, this.masonryHorizontal.rowXs ) - this.posLeft; + var containerWidth = Math.max.apply( Math, this.masonryHorizontal.rowXs ); return { width: containerWidth }; }, @@ -1106,8 +1099,8 @@ } // position the atom - x = instance.fitColumns.x + instance.posLeft; - y = instance.fitColumns.y + instance.posTop; + x = instance.fitColumns.x; + y = instance.fitColumns.y; instance._pushPosition( $this, x, y ); instance.fitColumns.width = Math.max( instance.fitColumns.x + atomW, instance.fitColumns.width ); @@ -1145,17 +1138,15 @@ var $this = $(this), col = ~~( props.index / props.rows ), row = props.index % props.rows, - x = ( col + 0.5 ) * props.columnWidth - - $this.outerWidth(true) / 2 + instance.posLeft, - y = ( row + 0.5 ) * props.rowHeight - - $this.outerHeight(true) / 2 + instance.posTop; + x = ( col + 0.5 ) * props.columnWidth - $this.outerWidth(true) / 2, + y = ( row + 0.5 ) * props.rowHeight - $this.outerHeight(true) / 2; instance._pushPosition( $this, x, y ); props.index ++; }); }, _cellsByColumnGetContainerSize : function() { - return { width : Math.ceil( this.$filteredAtoms.length / this.cellsByColumn.rows ) * this.cellsByColumn.columnWidth + this.posLeft }; + return { width : Math.ceil( this.$filteredAtoms.length / this.cellsByColumn.rows ) * this.cellsByColumn.columnWidth }; }, _cellsByColumnResizeChanged : function() { @@ -1173,15 +1164,14 @@ _straightAcrossLayout : function( $elems ) { var instance = this; $elems.each( function( i ){ - var $this = $(this), - x = instance.straightAcross.x + instance.posLeft; - instance._pushPosition( $this, x, instance.posTop ); + var $this = $(this); + instance._pushPosition( $this, instance.straightAcross.x, 0 ); instance.straightAcross.x += $this.outerWidth(true); }); }, _straightAcrossGetContainerSize : function() { - return { width : this.straightAcross.x + this.posLeft }; + return { width : this.straightAcross.x }; }, _straightAcrossResizeChanged : function() { diff --git a/jquery.isotope.min.js b/jquery.isotope.min.js index da04be3..a4d0f1b 100644 --- a/jquery.isotope.min.js +++ b/jquery.isotope.min.js @@ -1,5 +1,5 @@ /** - * Isotope v1.3.110523 + * Isotope v1.3.110524 * An exquisite jQuery plugin for magical layouts * http://isotope.metafizzy.co * @@ -8,4 +8,4 @@ * * Copyright 2011 David DeSandro / Metafizzy */ -(function(a,b,c){var d=function(){function b(b,c){c=c||document.documentElement;var d=c.style,e;if(typeof d[b]=="string")return b;b=b.charAt(0).toUpperCase()+b.slice(1);for(var f=0,g=a.length;fg?1:fc.width&&(c.fitRows.x=0,c.fitRows.y=c.fitRows.height),f=c.fitRows.x+c.posLeft,g=c.fitRows.y+c.posTop,c._pushPosition(a,f,g),c.fitRows.height=Math.max(c.fitRows.y+e,c.fitRows.height),c.fitRows.x+=d})},_fitRowsReset:function(){this.fitRows={x:0,y:0,height:0}},_fitRowsGetContainerSize:function(){return{height:this.fitRows.height}},_fitRowsResizeChanged:function(){return!0},_cellsByRowReset:function(){this.cellsByRow={},this._getSegments(),this.cellsByRow.rowHeight=this.options.cellsByRow.rowHeight||this.$allAtoms.outerHeight(!0)},_cellsByRowLayout:function(a){var c=this,d=this.cellsByRow.cols;this.cellsByRow.atomsLen=a.length,a.each(function(a){var e=b(this),f=(a%d+.5)*c.cellsByRow.columnWidth-e.outerWidth(!0)/2+c.posLeft,g=(~~(a/d)+.5)*c.cellsByRow.rowHeight-e.outerHeight(!0)/2+c.posTop;c._pushPosition(e,f,g)})},_cellsByRowGetContainerSize:function(){return{height:Math.ceil(this.cellsByRow.atomsLen/this.cellsByRow.cols)*this.cellsByRow.rowHeight+this.posTop}},_cellsByRowResizeChanged:function(){return this._getIfSegmentsChanged()},_straightDownReset:function(){this.straightDown={y:0}},_straightDownLayout:function(a){var c=this;a.each(function(a){var d=b(this),e=c.straightDown.y+c.posTop;c._pushPosition(d,c.posLeft,e),c.straightDown.y+=d.outerHeight(!0)})},_straightDownGetContainerSize:function(){return{height:this.straightDown.y+this.posTop}},_straightDownResizeChanged:function(){return!0},_masonryHorizontalPlaceBrick:function(a,b,c){var d=Math.min.apply(Math,c),e=d+a.outerWidth(!0),f=c.length,g=f,h=this.masonryHorizontal.rows+1-f,i,j;while(f--)c[f]===d&&(g=f);i=d,j=this.masonryHorizontal.rowHeight*g+this.posTop,this._pushPosition(a,i,j);for(f=0;fc.height&&(c.fitColumns.x=c.fitColumns.width,c.fitColumns.y=0),f=c.fitColumns.x+c.posLeft,g=c.fitColumns.y+c.posTop,c._pushPosition(a,f,g),c.fitColumns.width=Math.max(c.fitColumns.x+d,c.fitColumns.width),c.fitColumns.y+=e})},_fitColumnsGetContainerSize:function(){return{width:this.fitColumns.width}},_fitColumnsResizeChanged:function(){return!0},_cellsByColumnReset:function(){this.cellsByColumn={},this._getSegments(!0),this.cellsByColumn.columnWidth=this.options.cellsByColumn.columnWidth||this.$allAtoms.outerHeight(!0)},_cellsByColumnLayout:function(a){var c=this,d=this.cellsByColumn.rows;this.cellsByColumn.atomsLen=a.length,a.each(function(a){var e=b(this),f=(~~(a/d)+.5)*c.cellsByColumn.columnWidth-e.outerWidth(!0)/2+c.posLeft,g=(a%d+.5)*c.cellsByColumn.rowHeight-e.outerHeight(!0)/2+c.posTop;c._pushPosition(e,f,g)})},_cellsByColumnGetContainerSize:function(){return{width:Math.ceil(this.cellsByColumn.atomsLen/this.cellsByColumn.rows)*this.cellsByColumn.columnWidth+this.posLeft}},_cellsByColumnResizeChanged:function(){return this._getIfSegmentsChanged()},_straightAcrossReset:function(){this.straightAcross={x:0}},_straightAcrossLayout:function(a){var c=this;a.each(function(a){var d=b(this),e=c.straightAcross.x+c.posLeft;c._pushPosition(d,e,c.posTop),c.straightAcross.x+=d.outerWidth(!0)})},_straightAcrossGetContainerSize:function(){return{width:this.straightAcross.x+this.posLeft}},_straightAcrossResizeChanged:function(){return!0}},b.fn.imagesLoaded=function(a){var b=this.find("img"),d=b.length,e=this;b.length||a.call(this),b.bind("load",function(){--d<=0&&a.call(e)}).each(function(){if(this.complete||this.complete===c){var a=this.src;this.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",this.src=a}});return this},b.fn.isotope=function(a){if(typeof a=="string"){var c=Array.prototype.slice.call(arguments,1);this.each(function(){var d=b.data(this,"isotope");if(!d)return b.error("cannot call methods on isotope prior to initialization; attempted to call method '"+a+"'");if(!b.isFunction(d[a])||a.charAt(0)==="_")return b.error("no such method '"+a+"' for isotope instance");d[a].apply(d,c)})}else this.each(function(){var c=b.data(this,"isotope");c?(c.option(a||{}),c._init()):b.data(this,"isotope",new b.Isotope(a,this))});return this}})(window,jQuery); +(function(a,b,c){var d=function(){function b(b,c){c=c||document.documentElement;var d=c.style,e;if(typeof d[b]=="string")return b;b=b.charAt(0).toUpperCase()+b.slice(1);for(var f=0,g=a.length;fg?1:fc.width&&(c.fitRows.x=0,c.fitRows.y=c.fitRows.height),f=c.fitRows.x,g=c.fitRows.y,c._pushPosition(a,f,g),c.fitRows.height=Math.max(c.fitRows.y+e,c.fitRows.height),c.fitRows.x+=d})},_fitRowsGetContainerSize:function(){return{height:this.fitRows.height}},_fitRowsResizeChanged:function(){return!0},_cellsByRowReset:function(){this.cellsByRow={index:0},this._getSegments(),this._getSegments(!0)},_cellsByRowLayout:function(a){var c=this,d=this.cellsByRow;a.each(function(){var a=b(this),e=d.index%d.cols,f=~~(d.index/d.cols),g=(e+.5)*d.columnWidth-a.outerWidth(!0)/2,h=(f+.5)*d.rowHeight-a.outerHeight(!0)/2;c._pushPosition(a,g,h),d.index++})},_cellsByRowGetContainerSize:function(){return{height:Math.ceil(this.$filteredAtoms.length/this.cellsByRow.cols)*this.cellsByRow.rowHeight+this.offset.top}},_cellsByRowResizeChanged:function(){return this._checkIfSegmentsChanged()},_straightDownReset:function(){this.straightDown={y:0}},_straightDownLayout:function(a){var c=this;a.each(function(a){var d=b(this);c._pushPosition(d,0,c.straightDown.y),c.straightDown.y+=d.outerHeight(!0)})},_straightDownGetContainerSize:function(){return{height:this.straightDown.y}},_straightDownResizeChanged:function(){return!0},_masonryHorizontalReset:function(){this.masonryHorizontal={},this._getSegments(!0);var a=this.masonryHorizontal.rows;this.masonryHorizontal.rowXs=[];while(a--)this.masonryHorizontal.rowXs.push(0)},_masonryHorizontalLayout:function(a){var c=this;a.each(function(){var a=b(this),d=Math.ceil(a.outerHeight(!0)/c.masonryHorizontal.rowHeight);d=Math.min(d,c.masonryHorizontal.rows);if(d===1)c._masonryHorizontalPlaceBrick(a,c.masonryHorizontal.rowXs);else{var e=c.masonryHorizontal.rows+1-d,f=[],g,h;for(h=0;hc.height&&(c.fitColumns.x=c.fitColumns.width,c.fitColumns.y=0),f=c.fitColumns.x,g=c.fitColumns.y,c._pushPosition(a,f,g),c.fitColumns.width=Math.max(c.fitColumns.x+d,c.fitColumns.width),c.fitColumns.y+=e})},_fitColumnsGetContainerSize:function(){return{width:this.fitColumns.width}},_fitColumnsResizeChanged:function(){return!0},_cellsByColumnReset:function(){this.cellsByColumn={index:0},this._getSegments(),this._getSegments(!0)},_cellsByColumnLayout:function(a){var c=this,d=this.cellsByColumn;a.each(function(){var a=b(this),e=~~(d.index/d.rows),f=d.index%d.rows,g=(e+.5)*d.columnWidth-a.outerWidth(!0)/2,h=(f+.5)*d.rowHeight-a.outerHeight(!0)/2;c._pushPosition(a,g,h),d.index++})},_cellsByColumnGetContainerSize:function(){return{width:Math.ceil(this.$filteredAtoms.length/this.cellsByColumn.rows)*this.cellsByColumn.columnWidth}},_cellsByColumnResizeChanged:function(){return this._checkIfSegmentsChanged(!0)},_straightAcrossReset:function(){this.straightAcross={x:0}},_straightAcrossLayout:function(a){var c=this;a.each(function(a){var d=b(this);c._pushPosition(d,c.straightAcross.x,0),c.straightAcross.x+=d.outerWidth(!0)})},_straightAcrossGetContainerSize:function(){return{width:this.straightAcross.x}},_straightAcrossResizeChanged:function(){return!0}},b.fn.imagesLoaded=function(a){var b=this.find("img"),d=b.length,e=this;b.length||a.call(this),b.bind("load",function(){--d<=0&&a.call(e)}).each(function(){if(this.complete||this.complete===c){var a=this.src;this.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",this.src=a}});return this},b.fn.isotope=function(a){if(typeof a=="string"){var c=Array.prototype.slice.call(arguments,1);this.each(function(){var d=b.data(this,"isotope");if(!d)return b.error("cannot call methods on isotope prior to initialization; attempted to call method '"+a+"'");if(!b.isFunction(d[a])||a.charAt(0)==="_")return b.error("no such method '"+a+"' for isotope instance");d[a].apply(d,c)})}else this.each(function(){var c=b.data(this,"isotope");c?(c.option(a||{}),c._init()):b.data(this,"isotope",new b.Isotope(a,this))});return this}})(window,jQuery);