Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6

Thread: PNGs in IE

  1. #1
    New Coder
    Join Date
    Mar 2007
    Posts
    39
    Thanks
    1
    Thanked 0 Times in 0 Posts

    PNGs in IE

    I am using the Active X control to display a transparent PNG. It works, except for a thin line above the image and a small square in the top right of it.

    http://holidaymaps.googlepages.com/world2.html

    The image is contained like this:
    <DIV>
    <OTHER IMAGE />
    <BR>
    <PNG IMAGE />
    </DIV>

    The html I am using embeded in JavaScript is:

    Code:
    <div id=holder" style="height:250px; width:250px; filter:alpha(opacity=60); -moz-opacity: 0.60; opacity:0.60"><img id="pixel" src="pixel.jpg" height="' + (myHeight - 160) + '" width="' + myWidth + '" /><br><img id="gradient" STYLE="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src=\'gradient.png\',sizingMethod=\'scale\');" height="60" width="' + myWidth + '" /></div>
    Does anyone know what I am doing wrong?

  • #2
    New Coder
    Join Date
    Mar 2007
    Posts
    39
    Thanks
    1
    Thanked 0 Times in 0 Posts
    can anyone help me at all?

  • #3
    Regular Coder QBall777's Avatar
    Join Date
    Mar 2005
    Location
    uk
    Posts
    156
    Thanks
    5
    Thanked 1 Time in 1 Post
    Hi

    The site is not displayed correctly in opera (all blacked out)

    What browser are you using to view this in?

  • #4
    New Coder
    Join Date
    Mar 2007
    Posts
    39
    Thanks
    1
    Thanked 0 Times in 0 Posts
    this site is only being developed for FF and IE. The problems are occuring in IE.

  • #5
    Regular Coder QBall777's Avatar
    Join Date
    Mar 2005
    Location
    uk
    Posts
    156
    Thanks
    5
    Thanked 1 Time in 1 Post
    OK I think you must be looking at this through IE6 not the latest IE7

    In IE7 your image is just a black box in the left corner.
    IE7 is sizing your image as you requested it style="height:250px; width:250px;
    Have you tried style="height:100%; width:100%;

  • #6
    New Coder
    Join Date
    Mar 2007
    Posts
    39
    Thanks
    1
    Thanked 0 Times in 0 Posts
    yes i am viewing in IE6 as i am on a corporate network that does not have IE7 installed yet. once i have this working in IE6 i will then start testing for IE7 at home.

    those size values are the size of the div that the image is contained within. they are arbitary values for the moment as the content displayed within them will nearly always be bigger than those values.

    the problem itself is getting the png to display properly. the transparancy works, but it still displays either a white or transparent line around the image and the little box you get top-left in an image before it has loaded. i am also experiencing the same problem with another png so im guessing that its my transparent png code thats wrong. i am using:

    Code:
    <img id="gradient" STYLE="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src=\'graphic_gradient.png\',sizingMethod=\'scale\');" height="60" width="' + myWidth + '" />
    myWidth being a variable calculated depending on window size.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •