Permalink
Browse files

js & docs : enable transitions for Opera 12

remove $.browser

v1.5.20

Ref #265
  • Loading branch information...
1 parent fbae723 commit deebbb2f3e249396750b547e87a4749977b38c63 @desandro desandro committed Oct 16, 2012
@@ -78,11 +78,6 @@ <h3>Layout modes</h3>
layoutMode: 'masonry'
};
- // ensure no transforms used in Opera
- if ( $.browser.opera ) {
- defaultOptions.transformsEnabled = false;
- }
-
{% include random-sizes.js %}
var setupOptions = $.extend( {}, defaultOptions, {
@@ -121,7 +121,7 @@ Add these styles to your CSS for [filtering](filtering.html), [animation](animat
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
- -o-transition-property: top, left, opacity;
+ -o-transition-property: -o-transform, opacity;
transition-property: transform, opacity;
}
@@ -298,13 +298,11 @@ The property name of the method within the `getSortData` option to sort item ele
<dl class="clearfix">
<dt><code>transformsEnabled</code></dt>
<dd class="option-type">Boolean</dd>
- <dd class="default"><code>!$.browser.opera</code></dd>
+ <dd class="default"><code><span class="kc">true</span></code></dd>
</dl>
Isotope uses CSS3 transforms to position item elements, when available in the browser. Setting `transformsEnabled` to <code><span class="kc">false</span></code> will disable this feature so all browsers use top/left absolute positioning. Useful for [resolving issues with CSS transforms](help.html#css-transforms).
-Default value is set to <code><span class="kc">false</span></code> for Opera. See [Help: CSS transforms in Opera](help.html#css_transforms_in_opera).
-
### Additional CSS {#transformsEnabled-css}
If you do disable transforms, but still want to use [CSS transitions](animating.html#css_transitions), you'll need add the following CSS:
@@ -49,7 +49,7 @@ To enable animation with CSS transitions, you'll need the following code in your
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
- -o-transition-property: top, left, opacity;
+ -o-transition-property: -o-transform, opacity;
transition-property: transform, opacity;
}
@@ -138,9 +138,7 @@ isotopeInstance.masonry.columnWidth; // Layout mode specific properties
## CSS transforms in Opera
-Currently, [using CSS transforms in Opera distorts text rendering](http://dropshado.ws/post/1260101028/opera-transform-issues). To avoid this issue, the default value of [`transformsEnabled`](options.html#transformsenabled) is set to <code><span class="kc"></span></code> for Opera.
-
-Also note that the [recommended transition CSS](animating.html#css_transitions) uses `left`/`top` properties for Opera.
+[Using CSS transforms in older versions Opera (< 12) distorts text rendering](http://dropshado.ws/post/1260101028/opera-transform-issues). See how to enable [CSS transitions with top, left positioning](options.html#transformsEnabled-css).
## Infinite Scroll with filtering or sorting
View
@@ -34,7 +34,7 @@
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
- -o-transition-property: top, left, opacity;
+ -o-transition-property: -o-transform, opacity;
transition-property: transform, opacity;
}
View
@@ -1,5 +1,5 @@
/**
- * Isotope v1.5.19
+ * Isotope v1.5.20
* An exquisite jQuery plugin for magical layouts
* http://isotope.metafizzy.co
*
@@ -260,7 +260,7 @@
transitionEndEvent = {
WebkitTransitionProperty: 'webkitTransitionEnd', // webkit
MozTransitionProperty: 'transitionend',
- OTransitionProperty: 'oTransitionEnd',
+ OTransitionProperty: 'oTransitionEnd otransitionend',
transitionProperty: 'transitionend'
}[ transitionProp ];
@@ -346,7 +346,7 @@
sortBy : 'original-order',
sortAscending : true,
resizesContainer : true,
- transformsEnabled: !$.browser.opera, // disable transforms in Opera
+ transformsEnabled: true,
itemPositionDataEnabled: false
};
View

Large diffs are not rendered by default.

Oops, something went wrong.

0 comments on commit deebbb2

Please sign in to comment.