html - Use jquery to make chat boxes float like facebook -
i'm trying make chat script facebook, problem when delete chat box , there place left empty, want example have 3 chat boxes , when delete first 1 want second 1 replace first 1 , third 1 replace second 1 , on. how create chat boxes:
function createchatbox(chatboxtitle,minimizechatbox) { if ($("#chatbox_"+chatboxtitle).length > 0) { if ($("#chatbox_"+chatboxtitle).css('display') == 'none') { $("#chatbox_"+chatboxtitle).css('display','block'); restructurechatboxes(); } $("#chatbox_"+chatboxtitle+" .chatboxtextarea").focus(); return; } $(" <div />" ).attr("id","chatbox_"+chatboxtitle) .addclass("chatbox") .html('<div class="chatboxhead" onclick="javascript:togglechatboxgrowth(\''+chatboxtitle+'\')"><div class="chatboxtitle">'+chatboxtitle+'</div><div class="chatboxoptions"> <a href="javascript:void(0)" onclick="javascript:closechatbox(\''+chatboxtitle+'\')">x</a></div><br clear="all"/></div><div class="chatboxcontent"></div><div class="chatboxinput"><textarea class="chatboxtextarea" onkeydown="javascript:return checkchatboxinputkey(event,this,\''+chatboxtitle+'\');"></textarea></div>') .appendto($( "#bottom" )); // add chat boxes $("#chatbox_"+chatboxtitle).css('bottom', '0px'); // chat box position chatboxeslength = 0; (x in chatboxes) { if ($("#chatbox_"+chatboxes[x]).css('display') != 'none') { chatboxeslength++; } } if (chatboxeslength == 0) { $("#chatbox_"+chatboxtitle).css('left', '0px'); // display chat box left } else { width = (chatboxeslength)*(218.3+7)+0; $("#chatbox_"+chatboxtitle).css('left', width+'px'); //boxes float left } chatboxes.push(chatboxtitle); if (minimizechatbox == 1) { minimizedchatboxes = new array(); if ($.cookie('chatbox_minimized')) { minimizedchatboxes = $.cookie('chatbox_minimized').split(/\|/); } minimize = 0; (j=0;j<minimizedchatboxes.length;j++) { if (minimizedchatboxes[j] == chatboxtitle) { minimize = 1; } } if (minimize == 1) { $('#chatbox_'+chatboxtitle+' .chatboxcontent').css('display','none'); $('#chatbox_'+chatboxtitle+' .chatboxinput').css('display','none'); } } chatboxfocus[chatboxtitle] = false; $("#chatbox_"+chatboxtitle+" .chatboxtextarea").blur(function(){ chatboxfocus[chatboxtitle] = false; $("#chatbox_"+chatboxtitle+" .chatboxtextarea").removeclass('chatboxtextareaselected'); }).focus(function(){ chatboxfocus[chatboxtitle] = true; newmessages[chatboxtitle] = false; $('#chatbox_'+chatboxtitle+' .chatboxhead').removeclass('chatboxblink'); $("#chatbox_"+chatboxtitle+" .chatboxtextarea").addclass('chatboxtextareaselected'); }); $("#chatbox_"+chatboxtitle).click(function() { if ($('#chatbox_'+chatboxtitle+' .chatboxcontent').css('display') != 'none') { $("#chatbox_"+chatboxtitle+" .chatboxtextarea").focus(); } }); $("#chatbox_"+chatboxtitle).show();}
and function want manipulate make trick work :
function closechatbox(chatboxtitle) { $('#chatbox_'+chatboxtitle).css('display','none'); restructurechatboxes(); $.post("chat.php?action=closechat", { chatbox: chatboxtitle} , function(data){ });}
Comments
Post a Comment