Note that there are some explanatory texts on larger screens.

plurals
  1. POPrevent other functions running after selected function
    text
    copied!<p>I have a div #imageSwap and three buttons #button1, #button2, #button3. The first two buttons change the HTML of the div to hold a specific image, the third starts a rotation of multiple images. </p> <p>For some reason, when the third (rotating) button is clicked it runs fine, but when the first or second button is clicked after the third, the animation runs when it shouldn't.</p> <pre class="lang-js prettyprint-override"><code>&lt;script language="javascript" type="text/javascript"&gt; $(document).ready(function () { setImageOne(); $('#button1').addClass('selected'); $("a#button1").click(function() { setImageOne(); $(this).addClass('selected'); $('#button2').removeClass('selected'); $('#button3').removeClass('selected'); }); $("a#button2").click(function() { commObj(); $(this).addClass('selected'); $('#button1').removeClass('selected'); $('#button3').removeClass('selected'); }); $("a#button3").click(function() { comProg(); $(this).addClass('selected'); $('#button1').removeClass('selected'); $('#button2').removeClass('selected'); }); }); function setImageOne() { $('#imageSwap').fadeIn(500).html('&lt;img src="slide1.png" /&gt;'); } function commObj() { $('#imageSwap').fadeIn(500).html('&lt;img src="co.png" /&gt;'); } function comProg() { $('#imageSwap').fadeIn(500).html('&lt;img src="bo2.png" /&gt;').delay(2000).fadeOut(500, function () { comProg2(); }); } function comProg2() { $('#imageSwap').fadeIn(500).html('&lt;img src="bo2.png" /&gt;').delay(2000).fadeOut(500, function () { comProg3(); }); } function comProg3() { $('#imageSwap').fadeIn(500).html('&lt;img src="bo2.png" /&gt;').delay(2000).fadeOut(500, function () { comProg4(); }); } function comProg4() { $('#imageSwap').fadeIn(500).html('&lt;img src="bo2.png" /&gt;').delay(2000).fadeOut(500, function () { comProg(); }); } &lt;/script&gt; </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload