Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Convert ALT to Caption

Reply
Thread Tools

Convert ALT to Caption

 
 
Roy Reed
Guest
Posts: n/a
 
      08-14-2006
I found a script that converts image alt text to a caption which I've tried
to modify for my needs:

function addCaption(imgElem) {
var captionElem = document.createElement("div");
captionElem.className = "caption";
var captionText = document.createTextNode(imgElem.alt);
captionElem.appendChild(captionText);
if(imgElem.nextSibling)
imgElem.parentNode.insertBefore(captionElem,imgEle m.nextSibling);
else
imgElem.parentNode.appendChild(captionElem);
with(imgElem.style) {
captionElem.style.width =
(imgElem.width+borderLeftWidth+borderRightWidth+pa ddingLeft+paddingRight)+"px";
}
return true;
}

<img src="forest.jpg" width="515" height="183" alt="Strathyre Forest at
Dawn - the forest is bathed in golden light and mist rises from between the
trees - &copy; Roy Reed, 1987" onload="javascript:addCaption(this)">

This works as I want if no border or padding is added to the image, but not
if they are. In IE6 the padding is added to the width of the created div,
but not the border width. In Firefox nothing is added.
Can anyone tell me how this should be coded.

Live example (with attribution to original code) at
www.reeddesign.co.uk/autocaption/

Thanks

Roy Reed


 
Reply With Quote
 
 
 
 
marss
Guest
Posts: n/a
 
      08-15-2006

Roy Reed написав:

> with(imgElem.style) {
> captionElem.style.width =
> (imgElem.width+borderLeftWidth+borderRightWidth+pa ddingLeft+paddingRight)+"px";
> }


You add string values.

<img width="500px"style="padding: 5 5 5 5">
In this case instead of "510px" you will get "500px5px5pxpx"
Use parseInt or parseFloat before summation.

 
Reply With Quote
 
 
 
 
Roy Reed
Guest
Posts: n/a
 
      08-15-2006

"marss" <(E-Mail Removed)> wrote in message
news:(E-Mail Removed) ups.com...

Roy Reed ???????:

>> with(imgElem.style) {
>> captionElem.style.width =
>> (imgElem.width+borderLeftWidth+borderRightWidth+pa ddingLeft+paddingRight)+"px";
>> }


>You add string values.
>
><img width="500px"style="padding: 5 5 5 5">
>In this case instead of "510px" you will get "500px5px5pxpx"
>Use parseInt or parseFloat before summation.


Is this what you meant?

with(imgElem.style) {
captionElem.style.width = parseFloat(imgElem.width+borderLeftWidth+
borderRightWidth+paddingLeft+paddingRight)+"px";
}

It gives exactly the same result.

Thanks for trying to help with this. I'm not a JavaScript expert.

Roy


 
Reply With Quote
 
marss
Guest
Posts: n/a
 
      08-16-2006

Roy Reed написав:

> Is this what you meant?
>
> with(imgElem.style) {
> captionElem.style.width = parseFloat(imgElem.width+borderLeftWidth+
> borderRightWidth+paddingLeft+paddingRight)+"px";
> }
>


No. I mean something like this
with(imgElem.style) {
captionElem.style.width =
(parseFloat(imgElem.width)+parseFloat(borderLeftWi dth)+

parseFloat(borderRightWidth)+parseFloat(paddingLef t)+parseFloat(paddingRight))+"px";
}

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
alt.autos.porsche928,rec.humor.oracle.d,alt.balordi.it,alt.computer,sci.med.laboratory . Computer Information 1 06-18-2004 08:44 AM



Advertisments