Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > ASP .Net > Transparent PNG

Reply
Thread Tools

Transparent PNG

 
 
Martin Eyles
Guest
Posts: n/a
 
      12-01-2004
I am trying to make image alpha transparency work in IE6. I was hoping

<img src="Graphics/TransparentLogo.png" width="249" height="42">

would work, but it doesn't. After looking around I found the work around

<div
style="FILTERrogidXImageTransform.Microsoft.Al phaImageLoader(src='Graphi
cs/LineViewTransparentLogo.png');WIDTH:249px;HEIGHT:4 2px">
<img src="Graphics/TransparentLogo.png" width="249" height="42"
style="FILTER:Alpha(opacity=0)">
</div>

which works perfectly, but is very ugly. I was hoping that by using the
asp:image tag, I would output the ugly version to IE6, and the neat version
to other browsers. I tried

<asp:image width="249" height="42" imageurl="Graphics/TransparentLogo.png"
alternatetext="LineViewT" runat="server" id="Image1">
</asp:image>

but this always outputs the neat non-working (in IE6) version. Is there a
way to make it output the different version, depending on the browser is
detects?

Thanks,
ME

--
Martin Eyles
http://www.velocityreviews.com/forums/(E-Mail Removed)


 
Reply With Quote
 
 
 
 
Franck Quintana
Guest
Posts: n/a
 
      12-01-2004
Hi,

You can create a webcontrol which derives from HtmlImage.
On PreRender you have to check HttpContext.Current.Request.Browser.... to
find what is the current browser used by the client.
After that you modify or add style property and it's good.

Franck.

I don't know if you have yet created webcontrols. So i can give you a sample
i have done.
It's a webcontrol i use to change the style of an image when the mouse
hovers on.

using System;

using System.Web;

using System.Web.UI;

using System.Web.UI.HtmlControls;

using System.Web.UI.WebControls;

namespace eMill.UI.Web.Controls

{

/// <summary>

/// Summary description for HoverImage.

/// </summary>

public class HoverImage : HtmlImage

{

public HoverImage() {}

public string ToolTip {

get {

Object savedState = this.ViewState["ToolTip"];

if ( savedState != null ) {

return (string)savedState;

}

return string.Empty;

}

set {

this.ViewState["ToolTip"] = value;

}

}

public string HoverImageSrc {

get {

Object savedState = this.ViewState["HoverImageSrc"];

if ( savedState != null ) {

return (string)savedState;

}

return string.Empty;

}

set {

this.ViewState["HoverImageSrc"] = value;

}

}

protected override void RenderAttributes(HtmlTextWriter writer) {

if(HoverImageSrc.Length > 0) {

Attributes.Add("onmousemove", "this.src=\"" + HoverImageSrc + "\"");

Attributes.Add("onmouseout", "this.src=\"" + Src + "\"");

}

if(ToolTip.Length > 0) {

Attributes.Add("title", ToolTip);

}

base.RenderAttributes (writer);

}

}

}


Hope this helps!
Franck.

"Martin Eyles" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
| I am trying to make image alpha transparency work in IE6. I was hoping
|
| <img src="Graphics/TransparentLogo.png" width="249" height="42">
|
| would work, but it doesn't. After looking around I found the work around
|
| <div
|
style="FILTERrogidXImageTransform.Microsoft.Al phaImageLoader(src='Graphi
| cs/LineViewTransparentLogo.png');WIDTH:249px;HEIGHT:4 2px">
| <img src="Graphics/TransparentLogo.png" width="249" height="42"
| style="FILTER:Alpha(opacity=0)">
| </div>
|
| which works perfectly, but is very ugly. I was hoping that by using the
| asp:image tag, I would output the ugly version to IE6, and the neat
version
| to other browsers. I tried
|
| <asp:image width="249" height="42" imageurl="Graphics/TransparentLogo.png"
| alternatetext="LineViewT" runat="server" id="Image1">
| </asp:image>
|
| but this always outputs the neat non-working (in IE6) version. Is there a
| way to make it output the different version, depending on the browser is
| detects?
|
| Thanks,
| ME
|
| --
| Martin Eyles
| (E-Mail Removed)
|
|

 
Reply With Quote
 
 
 
 
bruce barker
Guest
Posts: n/a
 
      12-01-2004
why don't you just convert the image to a transparent gif, which is
supported by IE.

-- bruce (sqlwork.com)

"Martin Eyles" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
| I am trying to make image alpha transparency work in IE6. I was hoping
|
| <img src="Graphics/TransparentLogo.png" width="249" height="42">
|
| would work, but it doesn't. After looking around I found the work around
|
| <div
|
style="FILTERrogidXImageTransform.Microsoft.Al phaImageLoader(src='Graphi
| cs/LineViewTransparentLogo.png');WIDTH:249px;HEIGHT:4 2px">
| <img src="Graphics/TransparentLogo.png" width="249" height="42"
| style="FILTER:Alpha(opacity=0)">
| </div>
|
| which works perfectly, but is very ugly. I was hoping that by using the
| asp:image tag, I would output the ugly version to IE6, and the neat
version
| to other browsers. I tried
|
| <asp:image width="249" height="42" imageurl="Graphics/TransparentLogo.png"
| alternatetext="LineViewT" runat="server" id="Image1">
| </asp:image>
|
| but this always outputs the neat non-working (in IE6) version. Is there a
| way to make it output the different version, depending on the browser is
| detects?
|
| Thanks,
| ME
|
| --
| Martin Eyles
| (E-Mail Removed)
|
|


 
Reply With Quote
 
Martin Eyles
Guest
Posts: n/a
 
      12-01-2004
"bruce barker" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
> why don't you just convert the image to a transparent gif, which is
> supported by IE.


I will have no alpha layer anti-aliasing in a gif, so will have jagged
edges.

--
Martin Eyles
(E-Mail Removed)


 
Reply With Quote
 
Franck Quintana
Guest
Posts: n/a
 
      12-01-2004
First PNG is normalized
Second PNG can have more than 256 Colors.
Third PNG has gradient transparency.

Franck.

"bruce barker" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed)...
| why don't you just convert the image to a transparent gif, which is
| supported by IE.
|
| -- bruce (sqlwork.com)
|

 
Reply With Quote
 
Hans Kesting
Guest
Posts: n/a
 
      12-01-2004
Martin Eyles wrote:
> I am trying to make image alpha transparency work in IE6. I was hoping
>
> <img src="Graphics/TransparentLogo.png" width="249" height="42">
>
> would work, but it doesn't. After looking around I found the work
> around
>
> <div
> style="FILTERrogidXImageTransform.Microsoft.Al phaImageLoader(src='Graphi
> cs/LineViewTransparentLogo.png');WIDTH:249px;HEIGHT:4 2px">
> <img src="Graphics/TransparentLogo.png" width="249" height="42"
> style="FILTER:Alpha(opacity=0)">
> </div>
>
> which works perfectly, but is very ugly. I was hoping that by using
> the asp:image tag, I would output the ugly version to IE6, and the
> neat version to other browsers. I tried
>
> <asp:image width="249" height="42"
> imageurl="Graphics/TransparentLogo.png" alternatetext="LineViewT"
> runat="server" id="Image1"> </asp:image>
>
> but this always outputs the neat non-working (in IE6) version. Is
> there a way to make it output the different version, depending on the
> browser is detects?
>
> Thanks,
> ME


see here:
http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html


 
Reply With Quote
 
Martin Eyles
Guest
Posts: n/a
 
      12-02-2004
"Hans Kesting" <(E-Mail Removed)> wrote
> Martin Eyles wrote:
> > I am trying to make image alpha transparency work in IE6. I was hoping
> >
> > <img src="Graphics/TransparentLogo.png" width="249" height="42">
> >
> > would work, but it doesn't....

>
> see here:
> http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html


Thanks Hans, the javascript code is very useful. Don't like the 'behaviour'
idea, but I'll fix that and make it normal javascript.

ME

--
Martin Eyles
(E-Mail Removed)


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
ANN: PNG image CAPTCHA with PNG canvas available (SkimpyGimpy) aaronwmail-usenet@yahoo.com Python 0 04-18-2007 07:33 PM
Transparent png's Jafar As-Sadiq Calley HTML 16 09-19-2005 12:30 PM
PNG image - transparent part clickable in Firefox Martin HTML 15 07-21-2005 01:44 PM
ie problem with transparent png Susanne HTML 8 08-02-2004 01:10 PM
transparent png on explorer Andrea Fino HTML 17 04-14-2004 02:17 AM



Advertisments