Transparency e Opacity don´t work in IE 8

35 views
Skip to first unread message

JB

unread,
Oct 24, 2012, 3:40:15 PM10/24/12
to prototype-s...@googlegroups.com
Hi

I'm using Prototype 1.2
And the transparency and opacity not work in ie8

My code:

    $('av-img').addEvent('mouseover', function(event){
   
       
        $('avatar_upload').setStyle('background', 'rgba(0, 0, 0, 0.6)');
        $('select-0').setStyle('color', '#fff');
     
    });
  
    $('av-img').addEvent('mouseout', function(event){
        $('avatar_upload').setStyle('background', 'transparent');
        $('select-0').setStyle('color', 'transparent');
    });
   
    $('avatar_upload').addEvent('mouseover', function(event){       
        $('avatar_upload').setStyle('background', 'rgba(0, 0, 0, 0.6)');
        $('select-0').setStyle('color', '#fff');
    });
   
    $('avatar_upload').addEvent('mouseout', function(event){ 
        $('avatar_upload').setStyle('background', 'rgba(0, 0, 0, 0.6)');
        $('select-0').setStyle('color', '#fff');
    });

How fix this bug?

Tks

Walter Lee Davis

unread,
Oct 25, 2012, 8:54:47 AM10/25/12
to prototype-s...@googlegroups.com

On Oct 24, 2012, at 3:40 PM, JB wrote:

> Hi
>
> I'm using Prototype 1.2

Wow, that's quite old! 1.7.1 is current, and given the pace of development, it too is getting long in the tooth.

> And the transparency and opacity not work in ie8

That's your problem right there. You're not using Prototype to make the element less than opaque, you're trying to use rgba color to do that, and IE doesn't support that natively. There are "filter" styles you can use to make a semi-opaque color in IE, but there's nothing magical about Prototype that suddenly makes IE capable of handling rgba.

What you might be confusing here is that Prototype does shim the opacity attribute for IE. But that doesn't behave the same way as rgba -- when you set an element to opacity: 0.4, that makes everything -- type, images, background color, border -- 40% opaque. Rgba backgrounds merely make the background semi-opaque, and leave the contents of the box opaque.

Walter
> --
> You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group.
> To view this discussion on the web visit https://groups.google.com/d/msg/prototype-scriptaculous/-/MkGnHbV-4SwJ.
> To post to this group, send email to prototype-s...@googlegroups.com.
> To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.

Reply all
Reply to author
Forward
0 new messages