Results 1 to 3 of 3

Thread: Cant get captions to show in image gallery

  1. #1
    Join Date
    Feb 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Cant get captions to show in image gallery

    Hi folks,

    I am creating an image gallery using thumbnails that swap both the image and a caption from an array of images and an array of captions. I can get the caption to change in an alert() but not on the page. Can anyone offer some help.

    here is the code

    <HTML>
    <HEAD>
    <TITLE>swapimg</TITLE>
    <SCRIPT LANGUAGE="JavaScript">
    <!-- hide
    var blurb = new Array();
    blurb[0]="blurb1"
    blurb[1]="blurb2"
    blurb[2]="blurb3"
    blurb[3]="blurb4"

    var aryImages = new Array();
    aryImages[0] = "images/rooiprt1-b.jpg";
    aryImages[1] = "images/rooiprt1-c.jpg";
    aryImages[2] = "images/rooiprt1-d.jpg";
    aryImages[3] = "images/rooiprt1-e.jpg";

    for (i=0; i < aryImages.length; i++) {
    var preload = new Image();
    preload.src = aryImages[i];
    }


    function swap(imgIndex) {
    document['imgMain'].src = aryImages[imgIndex];
    TheText = blurb[imgIndex];
    alert(TheText);
    }
    // End -->
    </script>


    </HEAD>
    <BODY onLoad="swap(0);">


    <table border="0">
    <tr>
    <td valign="top" align="left">
    <img name="imgMain" src="" border="0">
    </td>
    <td width="20">

    </td>
    <td valign="top" align="center" valign="top">
    <font face="Tahoma" size="2"><b>Click to enlarge.</b></font>
    <br>
    <br>
    <a href="javascript:swap(0)"><img src="rooiprt1-b-sml.jpg" border="0" width="60" height="42"></a>
    <a href="javascript:swap(1)"><img src="rooiprt1-c-sml.jpg" border="0" width="60" height="42"></a>
    <a href="javascript:swap(2)"><img src="rooiprt1-d-sml.jpg" border="0" width="60" height="42"></a>
    <a href="javascript:swap(3)"><img src="rooiprt1-e-sml.jpg" border="0" width="60" height="42"></a>
    <br>
    <br>
    <script language="JavaScript">document.write(TheText);</script>
    </td>
    </tr>
    </table>
    </BODY>
    </HTML>

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Change:

    HTML Code:
    <script language="JavaScript">document.write(TheText);</script>
    to:

    HTML Code:
    <span id="blurbarea"></span>
    and change:

    Code:
    alert(TheText);
    to:

    Code:
    document.getElementById('blurbarea').innerHTML=TheText;
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Feb 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Thanks

    That works great.

    Thank You

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •