Note Before Using This Trick Make Sure To Follow This:
*You Shouldn't use the script for no dragging 
*the positioning of it are already fixed no need for adjusting well its up to you
*Before You Complain or anything make sure you carefully read and follow the steps below 

[b]1) Compile this with your js files[/b]

[quote][b]Code:[/b]
if (!attachOnLoadHandler(function() { dragBox();})) window.onload = function() { dragBox();};
function dragBox() {
        DRAGGABLE.init();
}
if (typeof DRAGGABLE == "undefined") { DRAGGABLE = {}; }
DRAGGABLE = {
        init: function() {
                var trgt;
                try {
                    trgt = document.createElement("div");
                }catch(e) {
                    trgt = document.createElement("<div>");
                }
                trgt.id = "tl";
                trgt.style.position = "absolute";
                trgt.style.top = "550px";
                trgt.style.left = "350px";
                trgt.style.zIndex = 30000;
                document.getElementsByTagName("body")[0].appendChild(trgt);
                var d = "<table border=\"0\" width=\"300px\" bgcolor=\"#000000\" cellspacing=\"0\" cellpadding=\"5\" div align=\"left\" div id=\"chatbox\"></div>"+
                "<tr>"+
                "<td width=\"100%\">"+
                "<table border=\"0\" width=\"100%\" cellspacing=\"0\" cellpadding=\"0\" height=\"36\">"+
                "<tr>"+
                "<td id=\"tBar\" style=\"cursor:move\" width=\"100%\">"+
                "<ilayer width=\"100%\" onSelectStart=\"return false\">"+
                "<layer width=\"100%\" onMouseover=\"isHot=true;if (document.layers) DRAGGABLE.tetikusN4(tl)\" onMouseout=\"isHot=false\">"+
                "<center><h2>Chat Box</h2></center>"+
                "</layer>"+
                "</ilayer>"+
                "</td>"+
                "<td style=\"cursor:hand\" valign=\"top\">"+
                "<a href=\"#\" onClick=\"DRAGGABLE.hideMe();return false\"><img src=\"http://h1.ripway.com/myscript/closebutton.gif\" title=\"close\"></a>"+
                "</td>"+
                "</tr>"+
                "<tr>"+
                "<td width=\"100%\" bgcolor=\"#000000\"  style=\"padding:4px\" colspan=\"2\"><div id='cboxdiv' div align='center'><font size='1'>To Bring back this chat box just press The show the cbox button on the control panel</font><hr></div>"+
"<div align='center'><iframe frameborder='0' width='300px' height='180px' src='[b]Your cbox main src[/b]' marginheight='2' marginwidth='2' scrolling='auto' allowtransparency='yes' name='bryan' id='bryan'></iframe><br/><form name='chat' target='bryan' action='[b]Change Main To Submit[/b]' method='post'><input type='hidden' name='nme' value='"+pageViewerFName+"'><input type='hidden' name='eml' value='http://www.friendster.com/"+pageViewerID+"'><textarea style='overflow:hidden; background-color:transparent;color:#ffffff;' class='cboxMsgArea' cols='53' rows='4' name='pst'></textarea><br /><BR><input type='submit' class='cboxButtons' value='Submit' name='asa'><input class='cboxButtons' type='reset' value='Clear' maxlength='23' onClick='reset()'><input type='button' class='cboxButtons' value='Refresh' name='bryan' onClick='window.bryan.location.href=document.getElementById(\"bryan\").src'></form></td></div>"+
                "</tr>"+
                "</table>"+
                "</td>"+
                "</tr>"+
                "</table>";
                tx = document.getElementById("tl");
                tx.innerHTML = d;
                var link = "";
                try {
                    link = document.createElement("<a id=\"dl\" style=\"display: none\" href=\"#\" onclick=\"DRAGGABLE.showMe(this);return false\">");
                }catch(e) {
                    link = document.createElement("a");
                    link.setAttribute("id","dl");
                    link.setAttribute("href","#");
                    link.setAttribute("style","display: none");
                    link.onclick = function() {
                        DRAGGABLE.showMe();
                        return false;
                    };
                }
                link.innerHTML = "Show Chat Box";
                var q = document.getElementById("controlPanelButtons");
                q.appendChild(link);
                document.onmousedown = DRAGGABLE.tetikusInit;
                document.onmouseup = Function("ddEnabled=false");
                isHot = false;
        },
        hideMe: function() {
                document.getElementById("dl").style.display = "";
                if (document.all || !document.all && document.getElementById) kr.style.display = "none";
                else if (document.layers) document.tl.visibility = "hide";
        },
        showMe: function() {
                document.getElementById("dl").style.display = "none";
                if (document.all || !document.all && document.getElementById) kr.style.display = "";
                else if (document.layers) document.tl.visibility = "show";
        },
        tetikusInit: function(klik) {
                dx = document.all ? "BODY" : "HTML";
                kr = document.all ? document.all.tl : document.getElementById("tl");
                dy = document.all ? event.srcElement : klik.target;
                while (dy.id != "tBar" && dy.tagName != dx) {
                       dy = document.all ? dy.parentElement : dy.parentNode;
                }
                if (dy.id == "tBar") {
                    offsetx = document.all ? event.clientX : klik.clientX;
                    offsety = document.all ? event.clientY : klik.clientY;
                    nowX = parseInt(kr.style.left);
                    nowY = parseInt(kr.style.top);
                    ddEnabled = true;
                    document.onmousemove = DRAGGABLE.tetikus;
                }
        },
        tetikus: function(klik) {
                if (!ddEnabled) return;
                    kr.style.left = document.all ? nowX + event.clientX - offsetx : nowX + klik.clientX - offsetx;
                    kr.style.top = document.all ? nowY + event.clientY - offsety : nowY + klik.clientY - offsety;
                    return false;
        },
        tetikusN4: function(klik) {
                if (!document.layers) return;
                    N4 = eval(klik);
                    N4.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP);
                    N4.onmousedown = function(posisi) {
                        N4.captureEvents(Event.MOUSEMOVE);
                        N4x = posisi.x;
                        N4y = posisi.y;
                };
                N4.onmousemove = function(posisi) {
                    if (isHot) {
                        N4.moveBy(posisi.x - N4x, posisi.y - N4y);
                        return false;
                    }
                };
                N4.onmouseup = function() {
                    N4.releaseEvents(Event.MOUSEMOVE);
                };
        }
};[/quote]
[b]Notes:[/b]
as ephemeral says:
*Replace the 1st bold text with ur own cbox main src
*The other bold text must be change the main to submit
example:
this is your cbox main src
http://www4.cbox.ws/box/?boxid=3116217& � p;amp;sec=main
just change the main to submit
http://www4.cbox.ws/box/?boxid=3116217& � p;amp;sec=submit
hope you get it 

[b]2) And for the CSS[/b]
<">its up to you what will be the color of it
well thats it happy tweaking 

Preview: [url=http://profiles.friendster.com/45031198]CLICK!![/url]
Credits:
[b]Feruzz[/b] - For the draggable Script  

[b]Shirow[/b] - For Revising and modifying
[b]bryandg01[/b] - for the antiposer cbox script
					
Last edited by Shirow Masamune (2008-07-05 18:40:41)