Post by wildgoosespeeder on Oct 30, 2010 18:37:28 GMT -8
This code replaces the drop-down message icon select with clickable icons and highlights, using the color of your choosing, the currently selected icon. Editable in red, color can be words or hex. This code does ProBoards V4 images by default but you can change them to the ProBoards V5 images by replacing the green with "images.proboards.com/new/" (without quotes) and replacing the Purple with ".png" (without quotes).
Preview for ProBoards V4 Images
Preview for ProBoards V5 Images
Global Footer
<script language="javascript">
/*Replace Drop-Down Message Icon Select by wildgoosespeeder*/
var colorSelect = "#007000"; //Color to use for selected icon
//No need to edit below
if(document.postForm && document.postForm.icon && document.images.iconImage)
{
var iconHTML = "<table cellpadding='2' cellspacing='0' border='0'><tr>";
for(i = 0; i < document.postForm.icon.options.length; i++)
{
if(i == document.postForm.icon.selectedIndex)
{
iconHTML += "<td style='background-color:" + colorSelect + "'>";
}
else
{
iconHTML += "<td>";
}
iconHTML += "<a href='javascript:void(0);' onclick='selectThreadIcon(this.parentNode," + i + ");'><img src='http://s2.images.proboards.com/" + document.postForm.icon.options.value + ".gif' border='0' alt='" + document.postForm.icon.options.innerHTML + "' title='" + document.postForm.icon.options.innerHTML + "'/></a></td>";
}
iconHTML += "</tr></table>";
document.postForm.icon.parentNode.innerHTML += iconHTML;
document.postForm.icon.style.display = "none";
document.images.iconImage.style.display = "none";
}
function selectThreadIcon(objChange,iconIndex)
{
if(document.all)
{
objChange.parentNode.getElementsByTagName("td")[document.postForm.icon.selectedIndex].removeAttribute("style");
}
else
{
objChange.parentNode.getElementsByTagName("td")[document.postForm.icon.selectedIndex].style.removeProperty("background-color");
}
document.postForm.icon.selectedIndex = iconIndex;
document.images.iconImage.src = objChange.firstChild.firstChild.src;
objChange.style.backgroundColor = colorSelect;
}
</script>
Preview for ProBoards V4 Images
Preview for ProBoards V5 Images
Global Footer
<script language="javascript">
/*Replace Drop-Down Message Icon Select by wildgoosespeeder*/
var colorSelect = "#007000"; //Color to use for selected icon
//No need to edit below
if(document.postForm && document.postForm.icon && document.images.iconImage)
{
var iconHTML = "<table cellpadding='2' cellspacing='0' border='0'><tr>";
for(i = 0; i < document.postForm.icon.options.length; i++)
{
if(i == document.postForm.icon.selectedIndex)
{
iconHTML += "<td style='background-color:" + colorSelect + "'>";
}
else
{
iconHTML += "<td>";
}
iconHTML += "<a href='javascript:void(0);' onclick='selectThreadIcon(this.parentNode," + i + ");'><img src='http://s2.images.proboards.com/" + document.postForm.icon.options.value + ".gif' border='0' alt='" + document.postForm.icon.options.innerHTML + "' title='" + document.postForm.icon.options.innerHTML + "'/></a></td>";
}
iconHTML += "</tr></table>";
document.postForm.icon.parentNode.innerHTML += iconHTML;
document.postForm.icon.style.display = "none";
document.images.iconImage.style.display = "none";
}
function selectThreadIcon(objChange,iconIndex)
{
if(document.all)
{
objChange.parentNode.getElementsByTagName("td")[document.postForm.icon.selectedIndex].removeAttribute("style");
}
else
{
objChange.parentNode.getElementsByTagName("td")[document.postForm.icon.selectedIndex].style.removeProperty("background-color");
}
document.postForm.icon.selectedIndex = iconIndex;
document.images.iconImage.src = objChange.firstChild.firstChild.src;
objChange.style.backgroundColor = colorSelect;
}
</script>