We would have experienced this when we chat in Facebook,the chat box just blinks or Title bar just blinks.have you ever wondered how does they work.yes, they work just because of Javascript .This makes us easy visible of tabs and noticing it while working on any other tab in the browser.
here is the Javascript download link : Download
see the highlighted code below! this may be useful wherever you want and implementating this!
<script src="http://code.jquery.com/jquery-1.4.2.js"></script>
<script src="../jquery.titlealert.js"></script>
<script type="text/javascript" >
$(function()
{
$(".remove").click(function(){
var element = $(this);
var I = element.attr("id");
var info = 'id=' + I;
$("#loading").html('<img src="loader.gif" >');
$.ajax({
type: "POST",
url: "friendexec.php",
data: info,
success: function(){
$("#loading").ajaxComplete(function(){}).slideUp();
$('#shiva'+I).fadeOut(200).hide();
$.titleAlert(message,options);
or
$.titleAlert("New chat message!", {
requireBlur:false,
stopOnFocus:false,
duration:4000,
interval:700
});
}
});
return false;
});
});
</script>
How Does they work ?
when you receive a response from the database new entry through Ajax or Node.js may be anyother,the response is passed through this javascript functions and then the javascript start doing it process of title alert in the browser.And when the user clicks on it then the function comes to the end and goes on! this is how many things are happens in the advanced sites like Facebook ,Google etc.Why Do they Implement this ?
This Tends to be visible for the users and to pull attraction towards the tab! were nowadays many uses notify tone with these to make users to experience more comfortable.While the users are working more than a tab in the system,this may surely help them to interpret them and find difference.here is the Javascript download link : Download
how Easily We could code ?
see the highlighted code below! this may be useful wherever you want and implementating this!
<script src="http://code.jquery.com/jquery-1.4.2.js"></script>
<script src="../jquery.titlealert.js"></script>
<script type="text/javascript" >
$(function()
{
$(".remove").click(function(){
var element = $(this);
var I = element.attr("id");
var info = 'id=' + I;
$("#loading").html('<img src="loader.gif" >');
$.ajax({
type: "POST",
url: "friendexec.php",
data: info,
success: function(){
$("#loading").ajaxComplete(function(){}).slideUp();
$('#shiva'+I).fadeOut(200).hide();
$.titleAlert(message,options);
or
$.titleAlert("New chat message!", {
requireBlur:false,
stopOnFocus:false,
duration:4000,
interval:700
});
}
});
return false;
});
});
</script>
Compatibility:
Title Alert works with jQuery 1.3 and 1.4. It's tested in Firefox, Chrome, Internet Explorer >= 6 and Safari.
if you feel free comment below !
source : heyman.info
0 comments:
Post a Comment