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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 20
  1. #1
    ASP
    ASP is offline
    New Coder
    Join Date
    Jun 2003
    Posts
    37
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Works in Mozilla 1.7, not in IE 6.0

    <a href="#"
    onmouseover="changeImages('Disp48pcHolder',
    'Assets/Images/display48_over.jpg');
    return true;"
    onmouseout="changeImages('Disp48pcHolder',
    'Assets/Images/display48.jpg');
    return true;">
    <img src="Assets/Images/display48.jpg" name="Disp48pcHolder" width="109"
    height="63" border="0" id="Disp48pcHolder">
    </a>

    ...and in an external javascript document...

    function changeImages() {
    if (document.images && (preloadFlag == true)) {
    for (var i=0; i<changeImages.arguments.length; i+=2) {
    document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
    }
    }
    }

    Works in Mozilla 1.7 but not in IE 6.0. Thanks for your feedback.


    Respectfully,

    ASP

  • #2
    Senior Coder
    Join Date
    Jul 2004
    Location
    New Zealand
    Posts
    1,315
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by ASP
    Thanks for your feedback.
    There are much better ways of creating rollovers. CSS rollovers that preload all required images.

  • #3
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    <a href="#"
    onmouseover="changeImages('Disp48pcHolder',
    'Assets/Images/display48_over.jpg');
    return true;"
    onmouseout="changeImages('Disp48pcHolder',
    'Assets/Images/display48.jpg');
    return true;">
    <img src="Assets/Images/display48.jpg" name="Disp48pcHolder" width="109"
    height="63" border="0" id="Disp48pcHolder">
    </a>

    Code:
    <a href="javascript:void(0);" 
    onMouseOver="javascript:Disp48pcHolder.src='Assets/Images/display48_over.jpg';" onMouseOut="javascript:Disp48pcHolder.src='Assets/Images/display48.jpg';"><img src="Assets/Images/display48.jpg" name="Disp48pcHolder" width="109"
    height="63" border="0" id="Disp48pcHolder"></a>

    -james
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "

  • #4
    ASP
    ASP is offline
    New Coder
    Join Date
    Jun 2003
    Posts
    37
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the reply.

    I'm still curious. Is there a specific reason why the "changeImages()" function works in Mozilla 1.7 but not with IE 6.0?

    Thanks again.

  • #5
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Quote Originally Posted by jamescover
    Code:
    <a href="javascript:void(0);" 
    onMouseOver="javascript:Disp48pcHolder.src='Assets/Images/display48_over.jpg';" onMouseOut="javascript:Disp48pcHolder.src='Assets/Images/display48.jpg';"><img src="Assets/Images/display48.jpg" name="Disp48pcHolder" width="109"
    height="63" border="0" id="Disp48pcHolder"></a>
    -james
    That will work in IE but won't in Mozilla.

    ASP, your code seems to be fine. Are you sure there are no other error causing the onmouseover/onmouseout not to work? Or maybe preloadFlag is not set to true when browser is IE?
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #6
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    That will work in IE but won't in Mozilla

    I wouldn't know, I don't own the beast. But ya gotta love the irony of it though...considering the thread title


    -james
    Last edited by jamescover; 08-12-2004 at 04:46 AM.
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "

  • #7
    ASP
    ASP is offline
    New Coder
    Join Date
    Jun 2003
    Posts
    37
    Thanks
    0
    Thanked 0 Times in 0 Posts
    > Or maybe preloadFlag is not set to true when browser is IE?
    I'm not using any browser sniffing code.

    > There are much better ways of creating rollovers. CSS rollovers that
    > preload all required images.
    How is that done?


    Thanks for your replies.

  • #8
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    What is that rollover suppose to do???
    All I see is swaping one image for another onmouseover, onmouseout???

    There is no link...
    Why not just place the event handlers on the image using style.cursor so that you have an indication that something should happen???

    As for preloaded images....
    I'm sure a search of this forum would return hundreds of preload scripts. In fact, there is one that has been active within the last week if you look...

    But, the entire premise of that script makes no sense to me whatsoever....

    Regards;
    .....Willy

  • #9
    ASP
    ASP is offline
    New Coder
    Join Date
    Jun 2003
    Posts
    37
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Willy,

    > As for preloaded images.... I'm sure a search of this forum would return
    > hundreds of preload scripts. In fact, there is one that has been active
    > within the last week if you look...
    I sense your frustration. However, my visits to this forum have been highly infrequent. Also, I'm not interested in loading scripts and using them as a matter of convenience. Rather, I would prefer to understand the reasons for the errors and learn from them.

    > But, the entire premise of that script makes no sense to me whatsoever....
    How so? It's really quite simple. The "onMouseOver()" and "onMouseOut()" method handlers have been around a long time. Besides, it works in Mozilla 1.7, but not in IE 6.0. I'm inclined to think that the problem lies elsewhere, as was mentioned by another respondent to this thread.

    > Why not just place the event handlers on the image using style.cursor...
    I'll look into this.

    Again, I understand your frustration, but you may want to tone it down a notch or two.

  • #10
    ASP
    ASP is offline
    New Coder
    Join Date
    Jun 2003
    Posts
    37
    Thanks
    0
    Thanked 0 Times in 0 Posts
    glenngv,

    > Are you sure there are no other error causing the onmouseover/onmouseout
    > not to work?
    You may be right.

    From Dreamweaver MX 2004, I previewed the web page in IE6.0. After it loaded, an "Error on page" message appeared in the status bar. So, I did a validiation check from the Results Panel. No errors or warnings were returned.

    Next, I decided to comment out the <style> and <link> tags in order to disassociate this page with the respective external Javascript and CSS documents.

    I previewed in IE6.0 again and received the same "Error on page" message in the status bar.

    I don't get it. What am I missing here?

    Thanks again.

  • #11
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm not frustrated nor is it that I do not want to help you....
    I simply do not understand what it is you are trying to do...

    There is no link to follow...
    That rollover could simply be done with an:
    <img src="oldSrc.gif"
    onmouseover="this.src='newSrc.gif'"
    onmouseout="this.src='oldSrc.gif'"
    style="cursorointer"
    .....>

    And, as I said, if you look...
    There is an image preload script which is active on this board as we speak. But, still, I'm confused exactly what it is you are trying to do and what the problem is....

    Good luck;
    .....Willy

  • #12
    ASP
    ASP is offline
    New Coder
    Join Date
    Jun 2003
    Posts
    37
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Willy,

    That's cool, and I do appreciate your responses.

    In my original post I included the <a> tag which invokes the "changeImages()" function, through the "onMouseOver()" and "onMouseOut()" event handlers, and the "changeImages()" function, which is located in an external Javascript document.

    In any event, one of glenngv's replies prompted me to further scrutinize the web page containing the aforementioned <a> tag and the external Javascript document.

    As it turns out, glenngv was correct. The problem is not the "changeImages()" function. I have not yet pinpointed the cause, but I'm working on it.

    If I arrive at a solution, I'll gladly post it here. Thanks again for your response and, in fact, to all who responded.

  • #13
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,068
    Thanks
    0
    Thanked 256 Times in 252 Posts
    Quote Originally Posted by ASP
    After it loaded, an "Error on page" message appeared in the status bar. So, I did a validiation check from the Results Panel. No errors or warnings were returned.
    Double-click the exclamation icon in the status bar to see the details of the error.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #14
    ASP
    ASP is offline
    New Coder
    Join Date
    Jun 2003
    Posts
    37
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I believe I found the cause of this problem, and I would appreciate your feedback. I traced it down to statements within a specific function. For purposes of this discussion I left in one of the problem statements, but commented it out.

    // Javascript document code
    var preloadFlag = false;

    function preloadImages(webPage) {
    if (document.images) {
    function loadIndexPics() {
    // The problem statement commented out below
    // imgMlnLogo = newImage("Assets/Images/mln_logo.jpg");
    mlnLogo = newImage("Assets/Images/mln_logo.jpg");
    topLevelMenu = newImage("Assets/Images/mln_toplevelmenu.gif");
    sideMenu = newImage("Assets/Images/mln_sidement.gif");
    redBottle = newImage("Assets/Images/3dbottle_with_shadow.jpg");
    preloadFlag = true;
    }

    function loadDisplayPics() {
    display48 = newImage("Assets/Images/display48.jpg");
    display48_over = newImage("Assets/Images/display48_over.jpg");
    display42 = newImage("Assets/Images/display42.jpg");
    display42_over = newImage("Assests/Images/display42_over.jpg");
    preloadFlag = true;
    }

    switch(webPage) {
    case "index":
    loadIndexPics();
    break;
    case "displays":
    loadIndexPics();
    loadDisplayPics();
    break;
    }
    }
    }
    // ** End Javascript document code **

    As it now stands, the problem is resolved. However, I'd appreciate clarification as to why the problem existed. Here's my theory. The commented statement in the loadIndexPics() function - namely,

    imgMlnLogo = newImage("Assets/Images/mln_logo.jpg");

    - uses "imgMlnLogo" as an object reference to the Image object created by the "newImage()" function. The web page that utilizes the loadIndexPics() function contains an <img> tag, which name attribute is "imgMlnLogo". The error message I received indicated the object in question did not support the property or method. It sounds like an attempt was made to assign the <img> tag to the return value of the "newImage()" function call. I can why this would generate an error. However, if this is the case, I'm confused as to how the "imgMlnLogo" object reference in the external Javascript document equates to the "imgMlnLogo" <img> tag in the web page. I can understand if we had the following, for example.

    // In the Javascript document
    imgMlnLogo = document.getElementById("logo_id")

    , where the <img> tag utilized the "name" and "id" attributes, with "name" being "imgMlnLogo" and "id" being "logo_id".

    Otherwise, if the problem is as I suspect, I can't see how the object reference "imgMlnLogo" in the external Javascript document is in the same scope as that for the "imgMlnLogo" <img> tag. Perhaps it is by default, since all document images are maintained in the "images" collection for that page?

    Your feedback is greatly appreciated.

  • #15
    Regular Coder
    Join Date
    Aug 2002
    Location
    USA
    Posts
    625
    Thanks
    0
    Thanked 0 Times in 0 Posts
    topLevelMenu = newImage("Assets/Images/mln_toplevelmenu.gif");

    I'm surprised that works at all. There should be a space between the new operator and the object type.

    var topLevelMenu = new Image();


    Instead of writing a new image object statement for each image, try putting them in a loop for preloading:


    Code:
    <script>
    <!--
    
    var Imgs = []
    Imgs[0] = "image1.gif";
    Imgs[1] = "image2.gif";
    
    function preImg(){
    
    if (document.images){
    for (var i=0;i<Imgs.length;i++){
    var img = new Image();
    img.src = "images/" +Imgs[i];
    }
    }
    }
    preImg();
    
    //-->
    </script>


    -james
    Last edited by jamescover; 08-15-2004 at 07:10 AM.
    "God so loved the world that he gave his only begotten son, so that whosoever believed in him would not perish, but have everlasting life. For God did not send his son into the world to condemn the world, but so that through him the world might be saved. "


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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