You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
88 lines
2.1 KiB
JavaScript
88 lines
2.1 KiB
JavaScript
When an image is clicked, this script will show the image URL in a textbox. Useful for cases where you want others to be able to copy the image address easily for linking... such as for banners, logo graphics, etc. A single instance of the script can be attached to any number of images in the page.
|
|
|
|
---------------------
|
|
|
|
Paste the following script into the <head> ... </head> of
|
|
your page. There are no script set-ups needed.
|
|
|
|
|
|
<script language="JavaScript">
|
|
|
|
var isReady = false;
|
|
|
|
function showAddress(What){
|
|
if (isReady){
|
|
document.Which.Where.value = What;
|
|
document.Which.Where.focus();
|
|
document.Which.Where.select();
|
|
}else{
|
|
alert("This page is not fully loaded yet...\nPlease wait for the page to finish loading.");
|
|
}
|
|
}
|
|
|
|
function clearAddress(){
|
|
if (isReady){
|
|
document.Which.Where.value = '';
|
|
}else{
|
|
alert("This page is not fully loaded yet...\nPlease wait for the page to finish loading.");
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
The Body Tag Onload Event
|
|
------------------------------------
|
|
|
|
Add onload="isReady=true" to your body tag, as shown below.
|
|
This is necessary to prevent false object calls prior to
|
|
the page being fully loaded. Thus:
|
|
|
|
<body onload="isReady=true">
|
|
|
|
The TextBox
|
|
-------------------------
|
|
|
|
Insert the following code for the text box in your page. (It
|
|
may be anywhere in your page.) Do not change the form or
|
|
field names.
|
|
|
|
|
|
|
|
<form name="Which">
|
|
<input type="text" size="60" name="Where">
|
|
</form>
|
|
|
|
|
|
|
|
To clear the textbox from a link in the page, use this:
|
|
|
|
|
|
|
|
<a href="#" onClick="clearAddress()">
|
|
Clear
|
|
</a>
|
|
|
|
|
|
|
|
Step Four: Attaching To The Images
|
|
-----------------------------------
|
|
|
|
You may attach the script to as many images as you wish. To
|
|
attach to the image add onMouseDown="showAddress(this.src)"
|
|
to the img src tag, as shown in the sample below.
|
|
|
|
|
|
|
|
<img src="http://happycodings.com/image.gif"
|
|
width="100"
|
|
height="100"
|
|
border="0"
|
|
onMouseDown="showAddress(this.src)">
|
|
|
|
|
|
|
|
Note that you can use either the explicit http:// address of
|
|
the image, or just a relative address to the image file.
|
|
In the later case, it will still return the full http
|
|
path to the image in the text box.
|