Im at you mercy when it comes to Java Script - Help

Discussion in 'JavaScript' started by ChuckDrew, Jul 17, 2007.

0
  1. #1
    I'm rather new to web development, in fact I am working on my first "real" website (other than the "Hello World" lessons I have done in the past few weeks).

    I am trying to build a website for my sister, she is trying her own at becoming an art photographer for a living, so far she is breaking even.

    Here's my issue concerning Java Script (I have included the code for what I have so far below). I am making a javascript slide show so users can click on thumbnails of her photos which will take them to their respective enlarged photo in the slide show. Once in the slide show they can click "next" and "previous" to move from enlarged image to enlarged image. I also have a feature that will switch the images in the slide show automatically every 3000 ms.

    What I need to do is add a comment and a title to each image in the slide. So basically two separate bits of text to each image in the slide show, so the text changes with each image change.

    Also, from the thumbnail gallery, how could I link into a specific image on the slide show? Is it possible?

    I know this is really long winded but I hope it makes sense. I am almost at the point of using just plain html and no js.

    Any insight would be greatly appreciated. Thanks- Chuck

    Thank god for the Firefox spell checker.

    Code:
    ---------------------------------
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Photo Gallery</title>
    <script type="text/javascript">

    <!-- Begin
    NewImg = new Array (
    "gallery1/Bentzstreetsite.jpg",
    "gallery1/fog1site.jpg",
    "gallery1/fog2site.jpg",
    "gallery1/fog3site.jpg",
    "gallery1/perfectviewsite.jpg",
    "gallery1/tidalpoolsite.jpg",
    "gallery1/timothygrasssite.jpg",
    "gallery1/treetopsite.jpg",
    "gallery1/view1site.jpg",
    "gallery1/waterfordsite.jpg"
    );

    var ImgNum = 0;
    var ImgLength = NewImg.length - 1;

    //Time delay between Slides in milliseconds
    var delay = 3000;

    var lock = false;
    var run;
    function chgImg(direction) {
    if (document.images) {
    ImgNum = ImgNum + direction;
    if (ImgNum > ImgLength) {
    ImgNum = 0;
    }
    if (ImgNum < 0) {
    ImgNum = ImgLength;
    }
    document.slideshow.src = NewImg[ImgNum];
    }
    }
    function auto() {
    if (lock == true) {
    lock = false;
    window.clearInterval(run);
    }
    else if (lock == false) {
    lock = true;
    run = setInterval("chgImg(1)", delay);
    }
    }
    </script>
    </head>

    <body>

    <img src="gallery1/Bentzstreetsite.jpg" name="slideshow">
    <table>
    <tr>
    <td align="right"><a href="javascript:chgImg(-1)">Previous</a></td>
    <td align="center"><a href="javascript:auto()">Slide-Show</a></td>
    <td align="left"><a href="javascript:chgImg(1)">Next</a></td>
    </tr>
    </table>

    </body>
    </html>
     
    ChuckDrew, Jul 17, 2007 IP
  2. ajsa52

    ajsa52 Well-Known Member

    Messages:
    3,426
    Likes Received:
    125
    Best Answers:
    0
    Trophy Points:
    160
    #2
    ajsa52, Jul 17, 2007 IP