26th February 2009

CSS Opacity in Opera using jQuery

Whilst attempting to cross browser test a jQuery plug-in that I’m currently working on, I noticed that my opacity settings were being ignored in my current version of Opera (9.23).

$("#id").css({opacity: 0.8});

It turns out that the latest version of jQuery (1.3.1) doesn’t believe that Opera 9.2 supports CSS opacity, and therefore it is ignored completely.

There are two possible fixes for this, the first is to simply upgrade Opera to a newer version (the latest is 9.6.3).

The second option is to tell jQuery that opera does support opacity using the following – or similar – within your script:

if ($.browser.opera) {
    $.support.opacity = true;
}

2 Responses to “CSS Opacity in Opera using jQuery”

  1. It’s not the first Jquery-Opera bug I’ve come by. Opera has problems with a few of their plugins as well. Namely crossfade and some features of the UI such as the Accordion. Opera has caused just as many problems for me (when using Jquery) as IE 6 does for CSS, only they’re less documented.

    – Brent

  2. I had experienced the same bugs.
    But this fix didn’t work. I am testing on Opera 9.6.4 (newest)

    If there is a fix please let me know.

    I also tried to remove the jQuery code and add a CSS code:
    .transparent {
    filter:alpha(opacity=75);
    -moz-opacity:0.75;
    -khtml-opacity: 0.75;
    opacity: 0.75;
    }

    code from: http://blog.freelancer-id.com/index.php/2009/02/08/web-page-transparency-opacity

    But i had the same thing.. NO TRANSPARENCY :D

Leave a Reply

Categories

Twitter

About Me

“I have a geek lifestyle, except geeks don’t have a life. Or style!”

Hi, my name is Steve and this is my blog. I am a web developer based in the United Kingdom. I like (X)HTML, CSS, Flash, ActionScript3, PHP, JavaScript, MySQL, [paste trendy words here] and Mapping APIs.