WEB Rollover images in <included> .php aren't working

Discussion in 'OT Technology' started by Falconer, Feb 28, 2009.

  1. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    They work fine in my index.php page but not in any of the .php files I'm <including>. I tried putting all the javascript preload code in both the index.php file and in the files that are referenced, but neither of those solutions worked. I would think that it would preload when it loaded index.php and then get the image to switch to from the .php file, but I guess it doesn't work that way :confused:

    I have both the original and the rollover image uploaded.

    Of course it works when I preview it in Dreamweaver, but not in real life.

    Any ideas?

    edit - resolved, posts 13 and 14
     
    Last edited: Mar 1, 2009
  2. White Stormy

    White Stormy Take that, subspace!

    Joined:
    Sep 17, 2002
    Messages:
    85,486
    Likes Received:
    69
    Location:
    Sparkopolis
  3. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    Code in index (automatically inserted by Dreamweaver when I add a rollover image)

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link rel="stylesheet" href="jrcss.css" type="text/css" />
    <script language="JavaScript" type="text/JavaScript">
    <!--
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    </script>
    <body onLoad="MM_preloadImages('images/moreinfo2.jpg')">
    </head>
    Code in .php file to swap images (default code added by Dreamweaver)

    Code:
    <a href="http://affiliatelink" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('More Info','','images/moreinfo2.jpg',1)"><img src="images/moreinfo1.jpg" name="More Info" width="253" height="53" border="0"></a>
     
  4. matrixan

    matrixan New Member

    Joined:
    Aug 10, 2004
    Messages:
    1,570
    Likes Received:
    0
  5. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    That's where the button will take you when you click on it. I put "affiliatelink" because I am going to go in later and add my affiliate links.

    Were you asking about image sources? They're bolded below:

    <a href="http://affiliatelink" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('More Info','','images/moreinfo2.jpg',1)"><img src="images/moreinfo1.jpg" name="More Info" width="253" height="53" border="0"></a>
     
  6. intrktevo

    intrktevo New Member

    Joined:
    Oct 18, 2004
    Messages:
    5,781
    Likes Received:
    0
    Location:
    UCF
    are they in the same directory?
     
  7. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    yup.

    i have rollover images in my index.php file that are working. It's just the ones that are being called by another .php file that I'm <including> don't want to work.

    So it's like:

    index.php
    - swappable images that work-
    <?php include("phpfile.php");?>

    But within that phpfile.php, the swappable images, same code and everything, don't work. It just shows the initial image but it doesn't change on mouseover.
     
  8. marcom10

    marcom10 ...

    Joined:
    Jan 15, 2006
    Messages:
    4,096
    Likes Received:
    0
    Location:
    CT
  9. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    i know
     
  10. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    they swap just fine when i preview it in Dreamweaver. I didn't even realize they weren't working live until later when i was already working on something else.
     
  11. hank85

    hank85 sudo shred /dev/sda -f -v -z --iterations=6

    Joined:
    Jul 23, 2008
    Messages:
    4,360
    Likes Received:
    0
    Make all image calls in your css files and included files with absolute domain paths.

    "/images/path/to/image" rather than "images/path/to/image"
     
  12. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    ^ it's funny you mention that. None of my images were loading when I prefaced them with /. I had to remove all of them (so it was "images/file.jpg" instead of "/images/file.jpg") in order for them to show up.

    I don't understand why.

    edit - editing my rollover images in the manner you suggested didn't work. they still only load the initial image and don't change upon mouseover.
     
    Last edited: Mar 1, 2009
  13. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    Got it.

    The "name" field got changed.

    The value that follows onMouseOver="MM_swapImage(' has to match the value assigned by name=""and apparently there can't be a space in the name.

    So for example, the two bolded values below have to match, and cannot contain spaces:


    <a href="hngb" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('alpha','','images/moreinfo2.jpg',1)"><img src="images/moreinfo1.jpg" name="alpha" width="253" height="53" border="0"></a>


    The example I copied from my code in reply 3 had a space in the name and that's why it didn't work. I didn't know spaces weren't allowed as Dreamweaver's Rollover Image Wizard allowed me to enter a space in the name.
     
    Last edited: Mar 1, 2009
  14. Falconer

    Falconer OT Supporter

    Joined:
    Jun 23, 2006
    Messages:
    65,506
    Likes Received:
    1
    Also apparently there cannot be any duplicate names anywhere on a page, so if you have a ton of rollover images like I do, even if they're all the same graphic, you have to give each instance different names or they won't work.

    And earlier I managed to cross two names up, so when I put my mouse on one image, another image was changing :rofl:

    Geez it took me all afternoon to figure out why this wasn't working :rl:
     

Share This Page