Ivan Marsh wrote:
On Wed, 09 Mar 2005 14:31:04 -0800, ziggy.696040 wrote:
My web page has thumbnail pictures, and when the user clicks on a
thumbnail, I change the image source of a full-size image elsewhere on
the page. I'd also like to change the caption of the full-size image,
but I'm not sure how to set the value of the text. I've tried creating
a form with a single input field, and I can set the value of that
field, but the field has a sunken style that I can't get rid of, and
I'd like to find a different way of displaying the text.
Is there an easier way to change the value of a text field?
Thanks,
Tom
You don't need a form. Use an anchor and the innerHTML function.
The OP is better off to use a <span> rather than an <a> tag.
<a> is intended for navigation, either as a destination
(anchor) or link, whereas <span> is for in-line markup and does
not infer any presentational idiom or display characteristics
and therefore seems to better suit the OP's need.
<a name='myanchor'></a>
document.myanchor.innerHTML = '<b>my file name</b>';
Will change the page to:
<a name='myanchor'><b>my file name</b></a>
Not in any browser I tested. Removing "document." provides an
IE specific way of referencing a named element that will not
work in most other browsers.
A better, cross browser, standards compliant method is to add a
span in the HTML where the text is to appear, then modify its
content:
<span id="caption_00">the caption will appear here</span>
Then on the thumbnail onclick, add the script to change it:
<img ... onclick="changeCaption('caption_00',
'Here is the new caption');" ...>
And somewhere in the page (preferably in the head), put the
script that modifies the caption:
<script type="text/javascript">
function changeCaption(ele,txt) {
if (document.getElementById) {
document.getElementById(ele).firstChild.data = txt;
} else if (document.all) {
document.all[ele].firstChild.data = txt;
}
}
</script>
The function could be made more generic by having it use the
alt tag of the image for the caption and if its id is related to
the image to the id of the span, then the onclick could be
attached dynamically so that there is no need to add code for
the onclick to every thumbnail.
Always remembering of course that users without JavaScript
support will not see anything happen when the thumbnail is
clicked.
--
Rob
