Simple image viewer

Discussion in 'JavaScript' started by Grendor, Jun 2, 2005.

  1. #1
    I want to make very simple page where I have two buttons(previous and next) and when I click on them the pictures change(forward and backward).
    Shouldn't it be something like this:

    <head>
    function next() {
    if (document.slideform.slide[current+1]) {
    document.images.show.src = document.changer.slide[current+1].value;
    document.changer.slide.selectedIndex = ++current;
    }
    function previous() {
    if (current-1 >= 0) {
    document.images.show.src = document.slideform.slide[current-1].value;
    document.changer.slide.selectedIndex = --current;
    </head>

    <body>
    <form name=changer>
    <tr>
    <td align=center bgcolor="#C0C0C0">
    <input type=button onClick="previous();" value="<<" title="Previous">
    <input type=button onClick="next();" value=">>" title="Next">
    </td>
    </tr>
    </body>

    Perhaps somebody has allready finished script to do this?
     
    Grendor, Jun 2, 2005 IP
  2. mopacfan

    mopacfan Peon

    Messages:
    3,273
    Likes Received:
    164
    Best Answers:
    0
    Trophy Points:
    0
    #2
    If you're using asp, I have code I've written that does exactly that, but it's timed so it works like a slide show as well, with a pause button if you want to stop on a given image.
     
    mopacfan, Jun 2, 2005 IP
  3. Grendor

    Grendor Peon

    Messages:
    8
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thanks, but it has to be in non-server script-javascript.
     
    Grendor, Jun 2, 2005 IP
  4. mopacfan

    mopacfan Peon

    Messages:
    3,273
    Likes Received:
    164
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Have you searched places like javascript.com or other tech sites for a script. I'm sure there must be dozens of them out there. I thought about using javascript, but I did not want to load large images in the background.
     
    mopacfan, Jun 2, 2005 IP
  5. somebody

    somebody Peon

    Messages:
    4
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    $img = new setarray(3);
    $img[1] = "pic1a.jpg"; $img[2] = "pic2a.jpg"; $img[3] = "pic3a.jpg";

    function setarray(n){
    this.length = n; for (var i = 1; i <= n; i++); this = 0; return this;
    }

    function fwd() {
    if(ind < 6){
    ind = ind + 1
    var i2mod = document.getElementById('image'); i2mod.src = $img[ind];
    }
    }

    function back() {
    if(ind > 1){
    ind = ind - 1
    var i2mod = document.getElementById('image'); i2mod.src = $img[ind];
    }
    }

    make your page buttons, use back() and fwd(), it works; to reset it, make button, have onclick be something like "ind=0;fwd();return true;"

    questions? see my thread above yours, i still have questions!

    =b
     
    somebody, Jun 5, 2005 IP
  6. MyEasyCpa

    MyEasyCpa Peon

    Messages:
    336
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #6
    You might wanna stop spamming that! :)
     
    MyEasyCpa, Dec 21, 2010 IP