homepage Welcome to WebmasterWorld Guest from 54.234.228.64
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
IE png with jquery
Sandro87




msg:4192064
 5:13 pm on Aug 25, 2010 (gmt 0)

Hello this is the CSS code



.shop_hover{
background: url(img/shop_hover.png) no-repeat top;
width: 290px;
height:230px;
display:block;
padding:0;
margin:0;
}
div#showcase_home div.shop{
background:url(img/shop.png) no-repeat top;
margin-right:0;
}


This the HTML code


<div class="shop">
<a class="shop_hover" href="?page=shop"></a>
</div>



and this is the JS (jquery)


//Set opacity to 0
$('#showcase_home > div > a').css({'opacity':'0'});



$('#showcase_home > div').hover(

function () {
var selected_div = $(this).attr("class") + "_hover";
$(this).find('.' + selected_div).stop().fadeTo(500, 1)
},

function () {
var selected_div = $(this).attr("class") + "_hover";
$(this).find('.' + selected_div).stop().fadeTo(300, 0)
}

);



it basically shows another png on hover fading. Forgetting the IE6 existence , IE7-IE8 both shows a black color when its supposed to be transparent on the hover image only.
I tried to apply DD.roundies fix but the A tag loses the href propriety, so link won't work anymore!
Any other fix?

 

Major_Payne




msg:4192168
 7:56 pm on Aug 25, 2010 (gmt 0)

IE does not handle PNG transparency without the PNG fix [pcmag.com]. One of these may also have a solution for you:

[koivi.com...]
[phoenity.com...]
[twinhelix.com...]
[homepage.ntlworld.com...]
[killersites.com...]

Not sure if JQuery is taking this IE problem into account.

Sandro87




msg:4192186
 8:50 pm on Aug 25, 2010 (gmt 0)

Except the first example you linked all IE6 related problems.
IE7-8 that I care about do support transparency but for some odd reason it doesn't work on hover! :(

I so hate this browser

Major_Payne




msg:4192355
 6:11 am on Aug 26, 2010 (gmt 0)

Pictures are not displayed on Web sites in Internet Explorer [support.microsoft.com]

View products that this article applies to [support.microsoft.com]

Last link shows you that it affects IE 8 for all images at times.
APPLIES TO

* Windows Internet Explorer 8
* Windows Internet Explorer 7 in Windows Vista
* Windows Internet Explorer 7 for Windows Server 2003 IA64
* Windows Internet Explorer 7 for Windows XP
* Windows Internet Explorer 7 for Windows Server 2003

Sandro87




msg:4192483
 12:50 pm on Aug 26, 2010 (gmt 0)

I dont get it, what does it have to do with my problem?

milosevic




msg:4192501
 1:41 pm on Aug 26, 2010 (gmt 0)

When you said dd_roundies, you mean dd_belatedPNG?

I've had all sorts of issues with png scripts in the past and have had to use different scripts for different sites because of bugs.

My suggestions would be to try an assortment and see if you can find one that works.

Could the href attribute being removed have something to do with the <a> being empty? try putting something in there to test. Also I wouldn't recommend using a relative link that's just a query string.

Sandro87




msg:4193132
 4:21 pm on Aug 27, 2010 (gmt 0)

actually I gave up on this for now, it will sure happen again in the near future. right now i just cant lose my mind to fix IE problems

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved