<p>I'm displaying a set of images as an overlay using Google Maps. Displaying these images should be in an endless loop but most most browsers detect this, and display a warning. </p>

<p>Is there a way to make a endless loop in JavaScript so that it isn't stopped or warned against by the browser?</p>

[{'answer_id': 63039, 'author': 'Erik', 'author_id': 6733, 'author_profile': 'https://Stackoverflow.com/users/6733', 'pm_score': 4, 'selected': True, 'text': '<p>Try <a href="https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval" rel="nofollow noreferrer">setInterval</a> or <a href="https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/settimeout" rel="nofollow noreferrer">setTimeout</a>.</p>\n\n<p>Here is an example:</p>\n\n<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">\r\n<div class="snippet-code">\r\n<pre class="snippet-code-js lang-js prettyprint-override"><code>(show = (o) =&gt; setTimeout(() =&gt; {\r\n\r\n  console.log(o)\r\n  show(++o)\r\n\r\n}, 1000))(1);</code></pre>\r\n<pre class="snippet-code-css lang-css prettyprint-override"><code>.as-console-wrapper { max-height: 100% !important; top: 0; }</code></pre>\r\n</div>\r\n</div>\r\n</p>\n'}, {'answer_id': 63047, 'author': 'Crippledsmurf', 'author_id': 35031, 'author_profile': 'https://Stackoverflow.com/users/35031', 'pm_score': 0, 'selected': False, 'text': "<p>Perhaps try using a timer which retrieves the next image each time it ticks, unfortunately i don't know any JavaScript so I can't provide a code sample</p>\n"}, {'answer_id': 63050, 'author': 'Vinko Vrsalovic', 'author_id': 5190, 'author_profile': 'https://Stackoverflow.com/users/5190', 'pm_score': 2, 'selected': False, 'text': '<p>You should use a timer to continuously bring new images instead of an infinite loop. Check the <code>setTimeout()</code> function. The caveat is that you should call it in a function that calls itself, for it to wait again. Example taken from <a href="http://www.w3schools.com/js/js_timing.asp" rel="nofollow noreferrer">w3schools</a>:</p>\n\n<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">\r\n<div class="snippet-code">\r\n<pre class="snippet-code-js lang-js prettyprint-override"><code>var c = 0\r\nvar t;\r\n\r\nfunction timedCount() {\r\n  document.getElementById(\'txt\').value = c;\r\n  c = c + 1;\r\n  t = setTimeout("timedCount()", 1000);\r\n}</code></pre>\r\n<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form&gt;\r\n  &lt;input type="button" value="Start count!" onClick="timedCount()"&gt;\r\n  &lt;input type="text" id="txt"&gt;\r\n&lt;/form&gt;</code></pre>\r\n</div>\r\n</div>\r\n</p>\n'}, {'answer_id': 63057, 'author': 'Ana Betts', 'author_id': 5728, 'author_profile': 'https://Stackoverflow.com/users/5728', 'pm_score': 1, 'selected': False, 'text': "<p>Instead of using an infinite loop, make a timer that keeps firing every n seconds - you'll get the 'run forever' aspect without the browser hang.</p>\n"}, {'answer_id': 63080, 'author': 'Wyatt', 'author_id': 6886, 'author_profile': 'https://Stackoverflow.com/users/6886', 'pm_score': 0, 'selected': False, 'text': '<pre><code>function foo() {\n  alert(\'hi\');\n  setTimeout(foo, 5000);\n}\n</code></pre>\n\n<p>Then just use an action like "onload" to kick off \'foo\'</p>\n'}, {'answer_id': 63096, 'author': 'Marius', 'author_id': 1585, 'author_profile': 'https://Stackoverflow.com/users/1585', 'pm_score': 2, 'selected': False, 'text': '<p>The following code will set an interval and set the image to the next image from an array of image sources every second.</p>\n\n<pre><code>function setImage(){\n  var Static = arguments.callee;\n  Static.currentImage = (Static.currentImage || 0);\n  var elm = document.getElementById("imageContainer");\n  elm.src = imageArray[Static.currentImage++];\n}\nimageInterval = setInterval(setImage, 1000);\n</code></pre>\n'}, {'answer_id': 63168, 'author': 'Community', 'author_id': -1, 'author_profile': 'https://Stackoverflow.com/users/-1', 'pm_score': 0, 'selected': False, 'text': '<p>If it fits your case, you can keep loading new images to respond to user interaction, like <a href="http://flickriver.com/photos" rel="nofollow noreferrer">this website does</a> (just scroll down).</p>\n'}, {'answer_id': 64520, 'author': 'Thevs', 'author_id': 8559, 'author_profile': 'https://Stackoverflow.com/users/8559', 'pm_score': 0, 'selected': False, 'text': '<p>Just a formal answer:</p>\n\n<pre><code>var i = 0;\n\nwhile (i &lt; 1) {\n   do something...\n\n   if (i &lt; 1) i = 0;\n   else i = fooling_function(i);  // must return 0\n}\n</code></pre>\n\n<p>I think no browser would detect such things. </p>\n'}]
['https://Stackoverflow.com/questions/63011', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/7417/']