I am using the following slideshow, which starts on load.

<script type="text/javascript" src="js/jquery.cycle.all.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#displayscreen').cycle({
      fx:'fade',
      timeout: 4500,
      speed:   1000,
      delay: 1000,
//pager set-up here
      next: '#next',
      prev: '#prev'
      });
      
      $('#playControl').toggle(
    function() {
    $('#displayscreen').cycle('pause');
    $(this).html('<img src="graphic_files/Turn_On_Slideshow.gif">');
    },
    function() {
    $('#displayscreen').cycle('resume');
    $(this).html('<img src="graphic_files/Turn_Off_Slideshow.gif">');
    });
    
      
}); // end ready()
</script>

How can I make it NOT START ON LOAD?

Many professionals like art buyers do not want a slideshow to start automatically. They'd rather click through the images. I want to keep the slideshow as an option.

Do I have to replace the .ready? With what?

Thanks.

(deleted)

read the documentation, there's an 'auto' option or something like that.

The $(document).ready mechanism is meant to fire after the DOM has been loaded successfully but makes no guarantees as to the state of the images referenced by the page. When in doubt, fall back on the good ol' window.onload event:
window.onload = function()
{
//your code here
};
Now, this is obviously slower than the jQuery approach. However, you can compromise somewhere in between:
$(document).ready
(
function()
{
var img = document.getElementById("myImage");

var intervalId = setInterval(
function()
{
if(img.complete)
{
clearInterval(intervalId);
//now we can start rotating the header
}
},
50);
}
);

Thanks, marteen.

But if I'm not mistaken, using the window.onload event would equally trigger the slideshow to start automatically.

Which I want to prevent.

I want to give visitors a choice if they want the slideshow, or not.

I'm also not familiar with Javascript coding. I'm just putting some jquery elements together and am just able to do little changes e.g. adding preload.

I tried to replace document.ready with document.click.

Slideshow didn't start, but when I clicked the next button (which should only show the next image), the click triggered the slideshow to start.

What I'd need is an event that only starts the slideshow when I click a certain button.

I'm just going to put this out there but, why not have it play onclick of some element:

$('someButtonId').click(function(){
$('#displayscreen').cycle({
fx:'fade',
timeout: 4500,
speed: 1000,
delay: 1000,
//pager set-up here
next: '#next',
prev: '#prev'
});
});

Or have the slideshow paused right away:

$('#displayscreen').cycle('pause');
$(this).html('<img src="graphic_files/Turn_On_Slideshow.gif">');

or, you could READ THE DOCUMENTATION, like I said the first time. It took me 10 seconds to find the option:

{
    timeout: 0
}

Which has the same effect as manual slideshow. In all fairness, I've used this plugin dozens of times, so I knew it was capable of this.

Originally Posted by stbuchok

I'm just going to put this out there but, why not have it play onclick of some element:

$('someButtonId').click(function(){
$('#displayscreen').cycle({
fx:'fade',
timeout: 4500,
speed: 1000,
delay: 1000,
//pager set-up here
next: '#next',
prev: '#prev'
});
});

Or have the slideshow paused right away:

$('#displayscreen').cycle('pause');
$(this).html('<img src="graphic_files/Turn_On_Slideshow.gif">');

Thanks for giving me code to play with. Very helpful. I look forward to trying this out.

Originally Posted by wayfarer07

or, you could READ THE DOCUMENTATION, like I said the first time. It took me 10 seconds to find the option:

{
    timeout: 0
}

Which has the same effect as manual slideshow. In all fairness, I've used this plugin dozens of times, so I knew it was capable of this.

Did you mean the documentation of the cycle slideshow or the documentation of JQuery?

Jquery documentations are usually not informative for non-programmers (which I am, even though I am doing my best with the basic Javascript/JQuery I learned from the Missing Manual book).

But thanks for the timeout:0 tip!

Originally Posted by World

Did you mean the documentation of the cycle slideshow or the documentation of JQuery?

documentation of the cycle slideshow