SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Javascript not showing in IE6 at all.

    Hi guys,

    I've uploaded all the files to this address: -

    http://cloud81.white.prohosting.com/planning/index.html

    Any suggestions on why the JS works in IE7 and FF but not IE6?

    The script on hover over a area brings up another image. Yet in IE6 no image appears at all.

  2. #2
    SitePoint Evangelist pip's Avatar
    Join Date
    Jun 2001
    Location
    Cape Town, South Africa
    Posts
    548
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm not sure if this will solve your problem, considering that IE6 is a non-standards complaint browser, but it's worth a try.

    You're referencing the images in your document is a very old and non-standard way (even though this should work in IE and not in other clients).

    Instead of doing this:
    Code:
    document.n1.src = "...";
    try this:
    Code:
    document.images["n1"].src = "...";
    Or, alternatively, give your images ids, and go about it the proper way:
    Code:
    <img src="..." id="n1"/>
    
    javascript:
    document.getElementById("n1").src = "...";
    Like I said, I don't know if it'll work, but rather standards than non-standards... if it still doesn't work after that, at least we can debug standards.
    - Pip
    ---------------------------------------------------------------------------------
    Nothing takes the taste out of peanut butter quite like unrequited love.

  3. #3
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Pip,

    I tried both methods to no avail

  4. #4
    SitePoint Zealot
    Join Date
    Sep 2007
    Posts
    136
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    its not your javascript, its your CSS

    Code CSS:
    .step1:hover{ background-color: transparent; z-index: 50; }
    .step1:hover span{  visibility: visible; top: 0; left: 60px; }

    IE6 only supports :hover when applied to an <A> element


    change them to look like this:
    Code CSS:
    .step1 a:hover{ background-color: transparent; z-index: 50; }
    .step1 a:hover span{  visibility: visible; top: 0; left: 60px; }

  5. #5
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Gimbles,

    Just tried that as well. No avail either

  6. #6
    SitePoint Zealot
    Join Date
    Sep 2007
    Posts
    136
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by cloud81 View Post
    Hi Gimbles,

    Just tried that as well. No avail either
    well thats the problem, you just gotta modify that entire block, this should work:

    Code CSS:
    .step1 { float: left; z-index: 0; }
    .step1 a:hover{ background-color: transparent; z-index: 50; }
    .step1 a:link span{  float: left; padding: 5px; left: -1000px; visibility: hidden; text-decoration: none; }
    .step1 span img{ position: absolute; margin-top: 120px; margin-left: -3px; }
    .step1 a:hover span{  visibility: visible; top: 0; left: 60px; }

  7. #7
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Gimbles,

    Also just tried that. For some reason it made the hover over image visible rather than not. Also didn't work in IE6.

  8. #8
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by cloud81 View Post
    Hi guys,

    I've uploaded all the files to this address: -

    http://cloud81.white.prohosting.com/planning/index.html

    Any suggestions on why the JS works in IE7 and FF but not IE6?

    The script on hover over a area brings up another image. Yet in IE6 no image appears at all.
    As things stand at the time of writing, your image swaps don't work on FireFox because your images don't have ID attributes, but you are trying to address them via document.getElementById using their name attributes, which I.E. allows.
    You should replace your multiple swapping functions with a single function that accepts parameters.
    Tab-indentation is a crime against humanity.

  9. #9
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey Logic Ali,

    Yeah locally it was fine on mine. I've updated it on the server now.


Bookmarks

Posting Permissions

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