Web Analytics Made Easy -
StatCounter Help! (if you know JS, this should be easy...) - CodingForum

Announcement

Collapse
No announcement yet.

Help! (if you know JS, this should be easy...)

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Help! (if you know JS, this should be easy...)

    I'm new to Javascript, and have just grabbed the "slideshow" code from this site
    (free scripts, images and music effects)
    It's the manual photo 'slider' so you can click through a series of images.
    But I have 2 problems!
    1) It auto resizes images to the size of the first image, and seeing as I have some portrait and some landscape, it look really weird!
    Is there any quick and easy way to remedy this???
    2) I'd really like to be able to link to a particular image, so say you have a table of thumbnails, and if you click on say the 3rd one, it goes to the page with the slide show, and displays the 3rd image in the slideshow.
    Is this possible?
    If so, how?!

    This is really simple stuff for someone who knows JS, any help would be mush appreciated as I need the code ASAP.
    Credit, if asked, will be given!
    Thanks a truckload,
    Blue

  • #2
    So sorry!

    I forgot the code, silly me....
    here it is (all of it):

    <table border="0" cellpadding="0">
    <caption><strong>Air Show Photos</strong></caption>
    <tr>
    <td width="100%"><img src="plane1.gif" width="300" height="240" name="photoslider"></td>
    </tr>
    <tr>
    <td width="100%"><form method="POST" name="rotater">
    <div align="center"><center><p><script language="JavaScript1.1">
    var photos=new Array()
    var which=0

    /*Change the below variables to reference your own images. You may have as many images in the slider as you wish*/
    photos[0]="plane1.gif"
    photos[1]="plane2.gif"
    photos[2]="plane3.gif"
    photos[3]="plane4.gif"
    photos[4]="plane5.gif"


    function backward(){
    if (which>0){
    window.status=''
    which--
    document.images.photoslider.src=photos[which]
    }
    }

    function forward(){
    if (which<photos.length-1){
    which++
    document.images.photoslider.src=photos[which]
    }
    else window.status='End of gallery'
    }
    </script><input type="button" value="&lt;&lt;Back" name="B2"
    onClick="backward()"> <input type="button" value="Next&gt;&gt;" name="B1"
    onClick="forward()"><br>
    <a href="#" onClick="which=1;backward();return false"><small>Start Over</small></a></p>
    </center></div>
    </form>
    </td>
    </tr>
    </table>

    <p align="center"><font face="arial" size="-2">This free script provided by</font><br>
    <font face="arial, helvetica" size="-2"><a href="http://javascriptkit.com">JavaScript
    Kit</a></font></p>


    You can see the working thing at :

    Comment


    • #3
      To stop the resize change:

      <img src="plane1.gif" width="300" height="240" name="photoslider">

      To:

      <img src="plane1.gif" name="photoslider">

      To change the slideshow image:

      <a href="javascript: document.images.photoslider.src=photos[3];">Image 3</a>

      Comment


      • #4
        Cheers!

        Thanks for that, will let u no if doesn't work!

        Comment


        • #5
          It doesn't work!

          The image size thing does, in a manner of speaking, but because the original image needed to be resized, that caused all my major probs.
          But never mind that, I can fix it, here's the real prob!:

          I don't think I made myself clear about the 'linking' thing.
          I have one page, called "set4.html" that has a table full of thumbnails. I then have another, housing the slideshow of all those images, called "showset4.html"
          Now I want it so that if I click on a thumbnail in set4, it takes me to that specific image, in the showset4 page.
          The images are housed way down the directory (Images/Photos/Previews/SetNo./whatever...) so if you give me a code line like b4 please point out the bits that need to be changed!
          I just need a link from one page to a pic on the other...
          Cheers!
          Blue

          Comment


          • #6
            Please reply...

            This is really easy so please spare a mo of your time to helping me out...

            Comment


            • #7
              Try this:

              On page set4.html :

              <a href="showset4.html?1"><img src="plane1.gif"></a>
              <a href="showset4.html?2"><img src="plane2.gif"></a>

              On page showset4.html :

              <script>
              function loader() {
              url = location.search;
              num = url.substring(1,url.length);
              document.images.photoslider.src=photos[num];
              }
              </script>
              <body onload="loader();">

              Comment


              • #8
                That still won't work!
                It links to that page fine, but not to the picture in the array...
                Is there any other code I could give you or anything to make this easier?!
                (and thanx for the work u done on it already, even though it hasn't really helped...)

                Comment


                • #9
                  Here:
                  Attached Files

                  Comment

                  Working...
                  X