0

All I'm trying to do is set up a simple slide show using the commands Start,Pause,Faster and Slower to go through a couple slides but I'm having trouble getting it set up.

<html>

<head>
    <script type="text\javascript">
     var showing=null,   // Is the showing going? no - null
    pause=true,     // Does the pause button say pause
    start=true,     // Does the start button say start
    current_pic=0,  // Current picture on the screen
    pics=[ // Pictures
        "Baybridge.jpg",
        "Bridgenight.jpg",
        "Brooklynbridge.jpg"
        "SFbridge.jpg"
         ],
    max_pics=pics.length, // Number of pictures
    interval_start=1000, // Default starting interval
    interval=interval_start, // Current interval
    interval_change=200; // Incremental interval changes
/************************************************************
*                               *
* Function: show                        *
* Show the next picture                     *
*                               *
* Parameters: None                      *
*                               *
* Return : None                         *
*                               *
************************************************************/
function show()
    {
     current_pic++;
    if (current_pic>=max_pics) current_pic=0; // cycle back
    document.getElementById("image").src=pics "Baybridge.jpg" ;
       }

/************************************************************
*                               *
* Function:     show_start_stop                     *
*       Start/Stop the show                 *
*                               *
* Parameters: None                      *
*                               *
* Return :    None                      *
*                               *
************************************************************/
function show_start_stop()
    {
        if (start)
    {
    showing=setInterval("show()", interval);
    start=false;
    document.getElementById("start").value="Stop";
    }
        else        // button say stop
    {
    clearInterval(showing);
    showing=null;
    pause=true;
    document.getElementById("pause").value="Pause";
    start=true
    document.getElementById("start").value="Start";
    interval=interval_start;
       current_pic=0;
       document.getElementById("image").src=pics"Baybridge.jpg";
       }
       }

/************************************************************
*                                   *
* Function:     show_pause_continue                 *
*       Pause or continue the show              *
*                               *
* Parameters:    None                       *
*                               *
* Return :   None                       *
*                               *
************************************************************/
       function show_pause_continue()
    {
        if(showing==null) return;   // Show going?
      if(pause)             // Button say pause?
        {
        clearInterval(showing);
            pause=false;
           document.getElementById("pause").value="Continue";
        }
       else             // Button say continue
        {
        showing=setInterval("show()", interval);
            pause=true;
      document.getElementById("pause").value="Pause";
        }
         }
/************************************************************
*                               *
* Function: show_faster                     *
* Reduce the interval between pictures              *
*                               *
* Parameters: None                      *
*                               *
* Return : None                         *
*                                   *
************************************************************/
function show_faster()
  {
   if (showing == null) return;     // Show going on?
   if (interval<=interval_change) return;    // Too slow already?
    interval-=interval_change;
    clearInterval(showing);
   if (pause==false) return;            // Pausing?
   showing=setInterval("show()", interval);     // Continue
   }
/************************************************************
*                               *
* Function: show_slower                     *
* Increase the interval between pictures            *
*                               *
* Parameters: None                      *
*                               *
* Return : None                         *
*                                   *
************************************************************/
function show_slower()
{
if (showing == null) return; // Show going on?
interval+=interval_change;
clearInterval(showing);
if (pause==false) return; // Pausing?
showing=setInterval("show()", interval); // Continue
}
</script>
</head>

<body>
<!Image>
<img id="image" src="Baybridge.jpg" height=400 width=400> <br />
<! Buttons >
<form>
<input type=button name="start" value=Start
    onclick="show_start_stop();">
<input type=button name="pause" value=Pause
    onclick="show_pause_continue();">
<input type=button value=Faster onclick="show_faster();">
<input type=button value=Slower onclick="show_slower();">
</form>
</body>
</html>

Edited by mike_2000_17: Fixed formatting

2
Contributors
1
Reply
2
Views
6 Years
Discussion Span
Last Post by Airshow
0

The structure of the code is basically fine. It just needs debugging and tidying up.

Your browser's error console (or error messages) will help you.

Airshow

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.