Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

javascript to change an image source

Posted on 2011-03-17
2
170 Views
Last Modified: 2012-05-11
I want to use javascript to change the src for images in a pretty lengthy web-based report.  Code below is stripped down to the very basics, but doesn't work.  It correctly alerts with the Pic.id, and it changes the desired border, so I know it's close.  Any ideas for getting it to load the new src?

I'm on a windows7 platform for testing (not a server).  I don't think this is the problem thought, because the ATL and BEL images load correctly in the basic html.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<script type="text/javascript">
	function Ready() {
		alert("step1");
		var Pic = document.getElementById("r1c1");
		Pic.src="gif\HOU.Capacity.0307_0313.gif";
		Pic.border="4";
		Pic.width="100%";
		alert(Pic.id);
	}
</script>
</head>
<body onLoad="Ready()">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" width="100%">
	<tr>
		<td width="50%"><img id="r1c1" border="0" src="gif\ATL.Capacity.0307_0313.gif" width="100%"></td></td>
		<td width="50%"><img id="r1c2" border="0" src="gif\BEL.Capacity.0307_0313.gif" width="100%"></td></td>
	</tr>
</table>
</body>
</html>

Open in new window

0
Comment
Question by:motokent
2 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 35162123
Don't set the width a second time (line 11) :
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<script type="text/javascript">
	function Ready() {
		//alert("step1");
		var Pic = document.getElementById("r1c1");
		Pic.src="http://www.symbian-freak.com/images/news/07/11/android01.jpg";
		Pic.border="4";
		//Pic.width="100%";
		//alert(Pic.id);
	}
</script>
</head>
<body onLoad="Ready()">
<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" width="100%">
	<tr>
		<td width="50%"><img id="r1c1" border="0" src="http://www.droid-life.com/wp-content/uploads/2010/09/angry-birds-game.png" width="100%"></td></td>
		<td width="50%"><img id="r1c2" border="0" src="http://www.bazaarvoice.com/blog/wp-content/uploads/begging.jpg" width="100%"></td></td>
	</tr>
</table>
</body>
</html>

Open in new window

0
 

Author Closing Comment

by:motokent
ID: 35162237
Thank you.  It worked great.
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
submit 7 410
Select all element in the multi-select box 2 514
Jquery not working in IE 10 7 961
javascript, button, count 6 163
This article explains the steps required to use the default Photos screensaver to display branding/corporate images
The Nano Server Image Builder helps you create a custom Nano Server image and bootable USB media with the aid of a graphical interface. Based on the inputs you provide, it generates images for deployment and creates reusable PowerShell scripts that …
In an interesting question (https://www.experts-exchange.com/questions/29008360/) here at Experts Exchange, a member asked how to split a single image into multiple images. The primary usage for this is to place many photographs on a flatbed scanner…
I've attached the XLSM Excel spreadsheet I used in the video and also text files containing the macros used below. https://filedb.experts-exchange.com/incoming/2017/03_w12/1151775/Permutations.txt https://filedb.experts-exchange.com/incoming/201…

792 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question