Show bootstrap modal window only once onload via JS Cookie.js

Show bootstrap modal window only once onload via JS Cookie.html

<!-- Show bootstrap modal window only once onload via JS Cookie -->

<!-- link to the JS Cookie library: https://github.com/js-cookie/js-cookie -->
<script src="/path/to/js.cookie.js"></script>

<script>
	if (!Cookies.get('popup')) {
		setTimeout(function() {
			$('#siteModal').modal();
		}, 600);
	}

	$('#siteModal').on('shown.bs.modal', function () {
		// bootstrap modal callback function
		// set cookie
		Cookies.set('popup', 'valid', { expires: 3, path: "/" }); // need to set the path to fix a FF bug
	})
</script>

<!-- Bootstrap Modal Markup -->
<div class="modal fade" id="siteModal" tabindex="-1" role="dialog" aria-labelledby="siteModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-md">
		<div class="modal-content section">
			<div class="close-container" data-dismiss="modal" aria-label="Close">
				<span>X</span>
			</div>
			<!-- MODAL CONTENT GOES HERE -->
		</div>
	</div>
</div>

sir why its still opening every time i open the same page.

When I was run this code showing directly instead of a modal window.

=========== working now with the current date and time to removing cookies ===========

<script type='text/javascript'> function getCookie(cname) { var name = cname + "="; var ca = document.cookie.split(';'); for(var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return ""; } $(function(){ if(getCookie("lastAccessed") != ""){ var temp = new Date(getCookie("lastAccessed")); var noOfHrs = (new Date().getTime()-temp.getTime())/(1000*60*60); if(noOfHrs > 24){ showGreetings(); } }else{ showGreetings(); } document.cookie = "lastAccessed= "+new Date(); }); function showGreetings(){ var overlay = $('

'); overlay.show(); overlay.appendTo(document.body); $('.popup').show(); $('.close').click(function(){ $('.popup').hide(); overlay.appendTo(document.body).remove(); return false; }); $('.x').click(function(){ $('.popup').hide(); overlay.appendTo(document.body).remove(); return false; }); } </script>

This will fix the modal to show only once
if ( !Cookies.get('popup') ) { setTimeout( function() { $('#siteModal').modal().on('shown.bs.modal', function() { Cookies.set('popup', 'true', { expires: 3, path: "/" }); }); }, 600); }