Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy 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
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    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 :
    http://www.wsabstract.com/script/script2/pslide.shtml

  • #3
    Regular Coder
    Join Date
    Jun 2002
    Location
    Montreal, Canada
    Posts
    644
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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>

  • #4
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Cheers!

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

  • #5
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy 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

  • #6
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile Please reply...

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

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Location
    Montreal, Canada
    Posts
    644
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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();">

  • #8
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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...)

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Location
    Montreal, Canada
    Posts
    644
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here:
    Attached Files Attached Files


  •  

    Posting Permissions

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