Posts Tagged ‘popup’

Simple jQuery popup on page load examples

Sometimes people need to show some important information or Facebook likebox or advertisement or newsletter signup on popup when the website loads, without opening in a separate window. This can be achieved using the jQuery. Further these popup should not be popping every time the user browses various pages from the same website. So to prevent this we can use cookie or session check.

jQuery Popup

Here are two jQuery popup examples that will automatically loads on website visit.

1. First one uses PHP session to load it only once during the total browsing session, to see the popup again in action, close the browser and visit the demo link.

Show popup message for few seconds using jQuery

We have seen checking username availability using jQuery in earlier post. Here is a slight modification on showing of error/success message. The message will be shown as popup and disappears after few seconds. Using this way we can show the message in more fancy way.
The Javascript Code:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
function checkUserName(usercheck)
{
	var uname = document.getElementById('username').value;
	$.post("checkuser.php", {user_name: uname} , function(data)
		{			
			   if (data != '' || data != undefined || data != null) 
			   {				   
				  $('#usercheck').show();
				  $('#usercheck').html(data);
				  setTimeout("$('#usercheck').hide(); ", 3000); //display message for 3 seconds
			   }
          });
}

function checkUserLogin(user_id)
{
   if (user_id == '' || user_id == undefined || user_id == null) 
   {				   
	  $('#logincheck').show();
	  $('#logincheck').css('color', '#CC0000');
	  $('#logincheck').html('You must be logged in to submit.');
	  setTimeout("$('#logincheck').hide(); ", 3000); //display message for 3 seconds
   }
   else {
   	  document.frmPopMessage.submit();
   }
}
</script>


The CSS Code:

Powered by WordPress