Decided to post in this forum since I used a Javascript solution. Some of the newer css techniques can cause things like scrolling to bog down. I could not find a method of detecting if hardware acceleration is supported so I went back to browser version. This is an example of what I came up with:
html {
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
...
}
.noAccel {
background-attachment: scroll;
-webkit-background-size: auto;
-moz-background-size: auto;
-o-background-size: auto;
background-size: auto;
}
var ua = $.browser
var uav = parseInt(ua.version,10)
if ( (ua.webkit && uav < 600) || (ua.mozilla && uav < 2) || (ua.opera && uav < 11) || (ua.msie && uav < 9) )
$("html").addClass("noAccel")
The webkit version is probably incorrect. Is there a better way to detect hardware acceleration or another way of thinking about this?
