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 3 of 3
  1. #1
    New Coder
    Join Date
    Mar 2005
    Posts
    25
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Setting The SRC Attribute - Help!

    I have a php file and an html file with a simple javascript in it. My question is that if the first (default) image loads, why does the second image (when using the JS) fail to load? It gives a broken image icon in FF, and a red X in IE6.

    This is the php file. Basically, it just lightens the image i send to it. Nothing major, and this works great with my first image that I pass in. - The one that is hard-coded to the html.
    Code:
    <?php
    $imgsrc = ( isset($HTTP_GET_VARS['imgsrc']) ) ? $HTTP_GET_VARS['imgsrc'] : $HTTP_POST_VARS['imgsrc'];
    $imgsrc = htmlspecialchars($imgsrc);
    header ("Content-type: image/jpeg");
    $filename = $imgsrc;
    $img_src = ImageCreateFromJpeg ($filename);
    $size = getimagesize($filename);
    $img_des = ImageCreateFromJpeg ($filename);
    $white = ImageColorAllocate($img_des, 255, 255, 255);
    ImageFilledRectangle($img_des, 0, 0, $size[0], $size[1], $white);
    $opacity = 25;
    ImageCopyMerge($img_des, $img_src, 0, 0, 0, 0, $size[0], $size[1], $opacity);
    ImageJPEG ($img_des);
    ImageDestroy ($img_src);
    ImageDestroy ($img_des);
    ?>
    I have tried every layout I can think of in this html file. Moving the JS script around between the body, both before and after the image, and now the head, but no location works. I also tried using just a simple "theimage.src=newimage;" in place of the browser type selection, but that did not work either.
    Code:
    <html><head>
    <script lanuguage="JavaScript" type="text/javascript">
    <!--
    function changeImage(newimage){
    //	theimage.src=newimage;
      if(document.getElementById){
    		document.getElementById("theimage").src= newimage;
    	}else if(document.all&&!document.getElementById){
    		document.all.theimage.src= newimage;
    	}
    }
    //-->
    </script>
    </head><body>
    <img id="theimage" src="image.php?imgsrc=sample.jpg" onclick="changeImage('image.php?imgsrc=donate_button.jpg')">
    </body></html>
    Again, in this code here, sample.jpg loads perfectly, but donate_button.gif doesn't load at all.

    These are only sample filenames that I'm using to test this out. The error has to be in the html or javascript, doesn't it? Since the first image loads fine? I don't see anything wrong with my code, but maybe it's just me...
    Last edited by koinu; 04-11-2005 at 01:16 PM. Reason: Typo on file type

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    There is no use to use other reference that getElementById. All the modern browsers will get it. You may also use the this self reference to shorten the code

    function changeImage(obj,newimage){
    obj.setAttribute('src',newimage)
    }

    ...
    <img src="image.php?imgsrc=sample.jpg" onclick="changeImage(this,'image.php?imgsrc=donate_button.jpg')">
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    New Coder
    Join Date
    Mar 2005
    Posts
    61
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I think the problem here is that you cant call a php function after the page has loaded? That is my understanding of PHP. The first image loads fine because the HTML is parsed on the host and the php function is evaluated and it results in an image. When you change the value of src="" with javascript, the php function is not being evaluated by the host.

    You should post this question on a PHP forum mate.
    "It doesn't matter if I'm optomistic or not, nothing ever works out for me."


  •  

    Posting Permissions

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