javascript - JS local storage -
i having problem alert box have made show every time navigate slideshow using controls states "slideshow auto advance has stopped" wondering there way make cookie or store information locally if press control once , see message stop displaying if keep navigating.
js script
<script> $(document).ready( function() { $("#pressed1").click( function() { jconfirm('slideshow auto advance has stopped!<br />press ok stop showing message 2 hour.', 'website alert'); }); }); $(document).ready( function() { $("#pressed2").click( function() { jconfirm('slideshow auto advance has stopped!<br />press ok stop showing message 2 hour.', 'website alert'); }); }); $(document).ready( function() { $("#pressed3").click( function() { jconfirm('slideshow auto advance has stopped!<br />press ok stop showing message 2 hour.', 'website alert'); }); }); $(document).ready( function() { $("#pressed4").click( function() { jconfirm('slideshow auto advance has stopped!<br />press ok stop showing message 2 hour.', 'website alert'); }); }); </script> html code
<div id="main2"> <div id="gallery"> <div id="slides"> <div class="slide"><img src="imgs/slide.imgs/1.jpg" onmousedown="return false;" style="border-style: none" width="1040" height="400" alt="side" /></div> <div class="slide"><img src="imgs/slide.imgs/1.jpg" onmousedown="return false;" style="border-style: none" width="1040" height="400" alt="side" /></div> <div class="slide"><img src="imgs/slide.imgs/3.gif" onmousedown="return false;" style="border-style: none" width="1040" height="400" alt="side" /></div> <div class="slide"><a href="buywebdesign.html" onmousedown="return false;" target="_blank"><img src="imgs/slide.imgs/4.gif" style="border-style: none" width="1040" height="400" alt="side" /></a></div> </div> <div id="menu"> <ul><div class="thumbs"> <li class="fbar"> </li> <li class="menuitem"><a href=""><img src="imgs/slide.imgs/thumb_ball.png" id="pressed1" onmousedown="return false;" style="border-style: none" alt="thumbnail" /></a></li> <li class="menuitem"><a href=""><img src="imgs/slide.imgs/thumb_ball.png" id="pressed2" onmousedown="return false;" style="border-style: none" alt="thumbnail" /></a></li> <li class="menuitem"><a href=""><img src="imgs/slide.imgs/thumb_ball.png" id="pressed3" onmousedown="return false;" style="border-style: none" alt="thumbnail" /></a></li> <li class="menuitem"><a href=""><img src="imgs/slide.imgs/thumb_ball.png" id="pressed4" onmousedown="return false;" style="border-style: none" alt="thumbnail" /></a></li> </div> </ul> </div> </div> </div>
i dont understand specific requirement here's shot in air..
you can use window.localstorage ( object retained browser website irrespective of page reloads )
you can set flag like
$(document).ready( function() { window.localstorage['messaged_displayed'] = false; }); for first reload.. , whenever want display message do
if(!window.localstorage['messaged_displayed']) { jconfirm('slideshow auto advance has stopped!<br />press ok stop showing message 2 hour.', 'website alert'); window.localstorage['messaged_displayed'] = true; } then again reset flag false after 2 hours.
if dont know how implement then, i'd edit dylan hayes's example
$(document).ready(function () { var msg = "slideshow auto advance has stopped!<br />press ok stop showing message 2 hour."; $("#pressed1, #pressed2, #pressed3, #pressed4, #pressed5 ").click(function () { rightnow = new date() if (window.localstorage['lastclicked']) { if (rightnow - window.localstorage['lastclicked'] > 7200000) { // milliseconds of 2 hrs jconfirm(msg, 'website alert'); window.localstorage['lastclicked'] = rightnow } } else { window.localstorage['lastclicked'] = rightnow } }); }); 
Comments
Post a Comment