View Full Version : Setting The SRC Attribute - Help!

04-11-2005, 01:11 PM
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.

$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.

<script lanuguage="JavaScript" type="text/javascript">
function changeImage(newimage){
// theimage.src=newimage;
document.getElementById("theimage").src= newimage;
}else if(document.all&&!document.getElementById){
document.all.theimage.src= newimage;
<img id="theimage" src="image.php?imgsrc=sample.jpg" onclick="changeImage('image.php?imgsrc=donate_button.jpg')">

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...

04-11-2005, 04:58 PM
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){

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

04-12-2005, 02:05 AM
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.