当用户在不同的选项卡上或离开时,突出显示新的聊天ping
问题描述:
I recently created a custom ping box (chat). I have a auto refresh every 3 seconds to get the latest content.
If the user is busy anywhere other than the chat tab, I would like the latest chat pings to be highlighted in some different color.
This would allow the user to easily identify the latest pings that came in when they weren't on the tab. The color then fades automatically after 10 sec of coming into the chat tab.
Code to refresh new content:
function loadNewPosts(){
var id = $(".altbgcolor:first").attr("id");
$.post('/updateping.php', { updateid: id }, function(data){
$(".newslist").prepend(data);
//alert(data);
}, 'html');
}
window.setInterval(loadNewPosts, 1000*3)
Is it possible to code this using PHP and/or jQuery?
我最近创建了一个自定义ping框(聊天)。 我每3秒自动刷新一次以获取最新内容。 p>
如果用户在聊天选项卡以外的任何地方忙碌,我希望最新的聊天ping在某些不同的地方突出显示 颜色。 p>
这将允许用户轻松识别不在选项卡上时出现的最新ping。 然后,颜色会在进入聊天选项卡10秒后自动消失。 p>
刷新新内容的代码: p>
function loadNewPosts() {
var id = $(“。altbgcolor:first”)。attr(“id”);
$ .post('/ updateping.php',{updateid:id},function(data){\ n $(“。newslist”)。prepend(data);
// alert(data);
},'html');
}
window.setInterval(loadNewPosts,1000 * 3)\ n code> pre>
是否可以使用PHP和/或jQuery对此进行编码? p>
div>
答
You need to use the blur
event of the window to change the class of the divs created out of focus.
Like this:
$(window).blur(function() {
//Toggle ALL newly created divs to have a unique CSS class
//For this example lets call it "outOfFocus"
});
Then when the window comes back into focus
use jqueryUI's highlight effect
$(window).focus(function() {
$(".outOfFocus").effect("highlight", {}, 10000);
//Toggle all newly created divs to have the normal "inFocus" CSS class
});
I recently created a custom ping box (chat). I have a auto refresh every 3 seconds to get the latest content.
If the user is busy anywhere other than the chat tab, I would like the latest chat pings to be highlighted in some different color.
This would allow the user to easily identify the latest pings that came in when they weren't on the tab. The color then fades automatically after 10 sec of coming into the chat tab.
Code to refresh new content:
function loadNewPosts(){
var id = $(".altbgcolor:first").attr("id");
$.post('/updateping.php', { updateid: id }, function(data){
$(".newslist").prepend(data);
//alert(data);
}, 'html');
}
window.setInterval(loadNewPosts, 1000*3)
Is it possible to code this using PHP and/or jQuery?
我最近创建了一个自定义ping框(聊天)。 我每3秒自动刷新一次以获取最新内容。 p>
如果用户在聊天选项卡以外的任何地方忙碌,我希望最新的聊天ping在某些不同的地方突出显示 颜色。 p>
这将允许用户轻松识别不在选项卡上时出现的最新ping。 然后,颜色会在进入聊天选项卡10秒后自动消失。 p>
刷新新内容的代码: p>
function loadNewPosts() {
var id = $(“。altbgcolor:first”)。attr(“id”);
$ .post('/ updateping.php',{updateid:id},function(data){\ n $(“。newslist”)。prepend(data);
// alert(data);
},'html');
}
window.setInterval(loadNewPosts,1000 * 3)\ n code> pre>
是否可以使用PHP和/或jQuery对此进行编码? p>
div>
You need to use the blur
event of the window to change the class of the divs created out of focus.
Like this:
$(window).blur(function() {
//Toggle ALL newly created divs to have a unique CSS class
//For this example lets call it "outOfFocus"
});
Then when the window comes back into focus
use jqueryUI's highlight effect
$(window).focus(function() {
$(".outOfFocus").effect("highlight", {}, 10000);
//Toggle all newly created divs to have the normal "inFocus" CSS class
});