It’s just data

CSS3 box-shadow

Chris Casciano: CSS properties box-shadow and rgba() and others like text-shadow are absolutely usable in the wild right now.

Works fine on elements that are position: fixed (example: my nav bar).  When I try to put it on either my articles or my section h2s, scrolling becomes jerky on Firefox 3.5.3, but remains smooth on Chrome 4.0.222.5.  Primary environment is Ubuntu 9.04, but I see similar things on Windows XP.


can you output a test page?

Posted by Robert Sayre at

Test pages: before, after.

Instructions: (1) go to top of page. (2) press down and hold the down arrow key.

Posted by Sam Ruby at

Doesn’t seem to happen in OS X with Firefox 3.5.3.

Posted by Bob Aman at

I can reproduce the issue with Firefox 3.5 on Ubuntu. It seems to be fixed in Firefox 3.6 and the Firefox trunk.

Posted by Robert Sayre at

In Safari 4.0.3 (4531.9) OSX 10.4.11 scrolling with up and down arrows on your site is jerky either way.

Posted by anonymoustester at

Oh, and in Firefox 3.5.1 OSX 10.4.11 its jerky neither way.

Posted by anonymoustester at

Sam, also adding that scrolling is horrible on this site in Opera with WinXP. CPU usage is also at 50% and makes typing really slow.

These problems are are fairly recent.

Switching off the stylesheet fixes everything.

In one of your previous posts I think you mentioned something about using svg backgrounds where possible. If so, I think that’s the problem.

In short though, it’s really bad and makes viewing this site a pain.

Posted by Michael A. Puls II at

I’m entering this in Opera on WinXP.  PageUp/PageDown seem fine, as does typing.  I do see some minor slowdown in scrolling, but not too bad.

Hmmm, I wonder if it is time to define some site preferences.

Posted by Sam Ruby at

An alternate style sheet that doesn’t use svg backgrounds that one could select via the UI ("style -> view" in Opera) might work.

Of course, it’s easy to override the style sheet with Opera’s site preferences, so not that big of a deal.

Posted by Michael A. Puls II at

In this case, the portion of the stylesheet that makes uses of svg is activated by the following JavaScript:

if (query.length>1 && query[1].search(/bgsvg/)>=0 || window.opera) {
  $('body').addClass('bgsvg');
}

Any mechanism (say, a cookie) that I could use to prevent my script from setting this property would revert Opera to a quick (albeit boxy) look.

Posted by Sam Ruby at

asdsad dasd adasd sad dasd adsadsad asd aczczc

Posted by anonymous at

Add your comment