StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p><strong>UPDATE: Seems to be fixed now in Chrome 23.</strong> (See @joequincy comment on the original question)</p> <hr> <p>Indeed, this seems like a bug. Until it is fixed, you can work around with the jQuery <code>animate()</code> function like this:</p> <pre><code>$(function() { var rotation = 163; $('body').on('click', function() { rotation = (rotation == 163) ? 198 : 163; $('#wheel').animate({ borderSpacing: rotation }, { step: function(now, fx) { $(this).css('-webkit-transform', 'rotate(' + now + 'deg)'); $(this).css('-moz-transform', 'rotate(' + now + 'deg)'); $(this).css('-ms-transform', 'rotate(' + now + 'deg)'); $(this).css('-o-transform', 'rotate(' + now + 'deg)'); $(this).css('transform', 'rotate(' + now + 'deg)'); } }); }); }); </code></pre> <p>Remove the <code>transition</code> CSS statements and add:</p> <pre><code>border-spacing: 163px; </code></pre> <p>This example misuses the <code>border-spacing</code> attribute, since it won't affect your layout in most cases.</p> <p>See <a href="http://jsfiddle.net/hongaar/wLTLK/1/" rel="nofollow noreferrer">http://jsfiddle.net/hongaar/wLTLK/1/</a></p> <p>(Thanks to this answer: <a href="https://stackoverflow.com/questions/5462275/animate-element-transform-rotate">Animate element transform rotate</a>)</p> <p><em>NOTE</em>: You can optionally use the jQuery transform plugin to remove the ugly multiple <code>css()</code> calls and for a simpler version of the <code>animate()</code> syntax (but adding overhead). See <a href="https://github.com/louisremi/jquery.transform.js" rel="nofollow noreferrer">https://github.com/louisremi/jquery.transform.js</a></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload