Reposting this tutorial due to many requests... [url=http://profiles.friendster.com/azlov]PREVIEW1[/url] [url=http://profiles.friendster.com/renalvir]PREVIEW2[/url] -------------------------------------------------- Insert this part on your layout .CSS file: [quote]/* Change Borders Start */ /* TOP RIGHT */ .roundbox-tr { margin:0px 0px; padding:0; background:url("http://LINK_TO_YOUR/[color=red]toprightpic[/color]") no-repeat right top; width: 100%; } /* TOP LEFT */ .roundbox-tl { margin:0; padding:0; background: url("http://LINK_TO_YOUR/[color=red]topleftpic[/color]") no-repeat left top; } /* BOTTOM RIGHT */ .roundbox-br { margin:0; padding:0; background: url("http://LINK_TO_YOUR/[color=red]bottomrightpic[/color]") no-repeat right bottom; } /* BOTTOM LEFT */ .roundbox-bl { margin:0; padding:0; background: url("http://LINK_TO_YOUR/[color=red]bottomleftpic[/color]") no-repeat left bottom; } /* Change Borders End */[/quote] Where the links are your images... these are the patterns/samples [img]http:///renalvir.zuiken.net/wvm/mhy/images/tl.png[/img] [img]http:///renalvir.zuiken.net/wvm/mhy/images/tr.png[/img] [img]http:///renalvir.zuiken.net/wvm/mhy/images/bl.png[/img] [img]http:///renalvir.zuiken.net/wvm/mhy/images/br.png[/img] NOTE: these images are too small... your images should be bigger in order to occupy all the spaces on the box. and remember not to rip others boxes, for they worked hard for it... --------------------------------------------------------------------- Insert the code inside your .JS [quote]/* -- By RenAlvir 2008 --*/ function changeBorder(targetdivid) { var target = document.getElementById(targetdivid); target.innerHTML = "<div class=\"roundbox-tr\">" + "<div class=\"roundbox-tl\">" + "<div class=\"roundbox-br\">" + "<div class=\"roundbox-bl\">" + "<div class=\"taee\">" + target.innerHTML + "</div>" + "</div>" + "</div>" + "</div>" + "</div>"; } /* -- --*/ if (!attachOnLoadHandler(function(){loadBorders()})) window.onload = function(){loadBorders()}; function loadBorders() { //Insert here //Controlpanel changeBorder("0"); }[/quote] Other boxes: [quote]LEFT BOXES: //controlpanel changeBorder("0"); //photos changeBorder("1"); //blogs changeBorder("13"); //reviews changeBorder("12"); //moreabout changeBorder("6"); //publiccomments changeBorder("18"); //scrabook changeBorder("10");[/quote] [quote]RIGHT //meetrail changeBorder("14"); //friendsbox changeBorder("2"); //fanof changeBorder("7"); //groups changeBorder("8");[/quote] --------------END--------------- Hope you like it!

Last edited by renalvir (2008-02-26 05:27:59)