Search code examples
javascriptcsspolyfillsopera-mini

Opera mini css3 transform, gradient, transition polyfill?


Are there any secretly maintained in some undergithub laboratories shims for that damn lil browser that doesn't support anything in favor of download speed optimization? Im interested in css3 transitions, gradients, transforms. Any sane ideas would be greatly appreciated.


Solution

  • About transition/transform in Opera Mini:

    Opera Mini use OBML. The OBML server farm renders the requested web page then takes a snapshot of it before converting it into OBML and sending it to the browser. So page in Opera Mini can't be animated by css or javascript or gif.

    About gradients in Opera Mini:

    Opera Mini use servers based on Presto browser engine to render the page. Presto version 2.10 can render CSS3 gradients. Now Opera Mini 7.5 on Android (last version) use Presto 2.8 and Opera Mini 8 for Blackberry and Java-browsers use 2.9 version. So 2.10 is not so far (perhaps one year).

    Also you can use css inline base64 images via:

    some_selecor { 
      background-image: url(data:image/png;base64,base64_image_code_here);
    }
    

    in Opera Mini and you can set your gradient as encode background-image.

    IMHO:

    Opera Mini use server farm render to save battery level on your phone and to save your traffic (size of request in OBML is only 10% of HTTP requests size of the same page). So render all CSS3 features it not the main target of this browser.