[CB] Divided Categories with Head/Base Images

[Jay]

Preview: none
Placement: main footer
Compatability: PBv4 / cross-browser
Notes: read below
---

<script type="text/javascript">
<!--
/* Created by Jay.
Divided Categories with Head/Base Images

ngmaster.proboards21.com
This code may not be redistributed without permission.
Please leave this header intact at all times. */


var headBaseSettings = [
    ['URL TO HEAD IMAGE'], // head image
    ['URL TO BASE IMAGE'], // base image
    ['25'] // gap size
];

var getTR = document.getElementsByTagName('tr');
if (window.location.href.match(/com(\/$|\/index\.c\wi\??($|\w{6}=home)$)$/)) {
    for (var i = 1; i < getTR.length; i ++) {
        if (getTR.item(i).firstChild.colSpan == 2 && getTR.item(i).firstChild.firstChild.className == 'titletext' && getTR.item(i).firstChild.innerHTML.match(/>Forum Name</)) {
        var titleBase = document.createElement('img');
            titleBase.src = headBaseSettings[1];
        var cloneTitle = getTR.item(i).cloneNode(true).innerHTML;
        }
        if (getTR.item(i).firstChild.colSpan == 5 && getTR.item(i).firstChild.className == 'catbg' && getTR.item(i).firstChild.align != 'right') {
        var cloneTarget = getTR.item(i).getElementsByTagName('td')[0].cloneNode(true).innerHTML;
        var newTab = '<td id="del"></td></tr></table>' + (getTR.item(i - 1).innerHTML.match(/>Forum Name</)? '' : '<img src="' + headBaseSettings[1] + '" /><div style="height: ' + headBaseSettings[2] + 'px;"></div>') + '<img src="' + headBaseSettings[0] + '" style="vertical-align: bottom;" /><table width="100%" cellspacing="1" cellpadding="4" class="bordercolor"><tr><td class="catbg" colspan="6">' + cloneTarget + '</td></tr><tr id="frow">';
        eval("(getTR.item(i - 1).innerHTML.match(/>Forum Name</)? getTR.item(i).parentNode.parentNode.parentNode.parentNode.parentNode.insertRow(-1).insertCell(-1).appendChild(titleBase) : '')");
            getTR.item(i).parentNode.className = 'bordercolor';
            with (getTR.item(i).parentNode.parentNode.parentNode) {
                parentNode.parentNode.parentNode.style.backgroundColor = 'transparent';
                innerHTML = innerHTML.replace(getTR.item(i).cloneNode(true).innerHTML, newTab + cloneTitle);
            }
        }
        if (getTR.item(i).firstChild.id == 'del' || (getTR.item(i).id != 'frow' && getTR.item(i).getElementsByTagName('td')[0].className == 'titlebg' && getTR.item(i).getElementsByTagName('td')[0].innerHTML.match(/>Forum Name</))) {
            getTR.item(i).style.display = 'none';
        }
    }
}

//-->
</script>

---
This divides the categories, reverses the title and category order, and sets head/base images above and below each category. Below is how to edit.

The red bits are your head/base image url's.
The blue bit is the gap height.