<script type="text/javascript">
    inColor("maroon", new Array("Ник", "Ник"))
    inColor("#20ff20", new Array("Ник", "Ник"))

    function inColor(color, myarray){
    var a=document.links
    for(i=0;i<a.length;i++){
    for(q=0;q<myarray.length;q++){
    if(a[i].innerHTML==myarray[q]){
    a[i].innerHTML="<span style=\"color: "+color+";\">"+myarray[q]+"</span>"
    }}}}
    </script>

На шапку:


Для начала поставьте в хтмл-верх этот стиль:

<style>
#pun-title .title-logo {display : none;}
</style>

Он скроет стандартный логотип.
Далее ставьте ниже него этот скрипт

<script type="text/javascript">
var phr = new Array()
phr.push("http://www.dolem.com/lytebox/misc/pleiads_thumb.jpg")
phr.push("http://www.dolem.com/lytebox/misc/orion2_thumb.jpg")

document.write('<style>#pun-title table {background-image: url('+phr[Math.round(Math.random()*(phr.length-1))]+'); background-repeat: no-repeat;}</style>')
</script>

Красную строчку копируйте столько раз, сколько логотипов должно отображаться.
Ссылки (курсивом) смените на свои
Синяя часть это стиль, отвечающий за оформление вашего логотипа, его вы можете менять как захотите. 
жирную часть не трогайте, она отвечает за ссылку, которая случайным образом подставится в этот стиль.


Для рандомного отображения просто картинок (в хтмл-верх-низ, объявлении):
выделенное копировать сколь угодно

<script>
var phr = new Array()

phr.push("<img src='картинка' />")
phr.push("<img src='картинка' />")
phr.push("<img src='картинка' />")

document.write(phr[Math.round(Math.random()*(phr.length-1))])
</script>

Или другой. вставлять на место будущей картинки: 

<Script Language ="JavaScript">
function RandomNumber() 
{
  var today = new Date();
  var num= Math.abs(Math.sin(today.getTime()/1000));
  return num;
}
function RandomGraphics() 
{
  var x = RandomNumber();
  if (x > .99) 
{document.write("<img src='ПУТЬ_ДО_КАРТИНКИ_1' align=center hspace=10>"); return; 
}
  if (x > .66) 
{document.write("<img src=’ПУТЬ_ДО_КАРТИНКИ_2' align=center hspace=10>"); return; 
}
  if (x > .33) 
{document.write("<img src='ПУТЬ_ДО_КАРТИНКИ_3' align=center hspace=10>"); return; 
}
}
RandomGraphics();
</script>

<div class="container"><a title="click" onclick="obj=this.parentNode.childNodes[1].style; tmp=(obj.display!='block') ? 'block' : 'none'; obj.display=tmp; return false;" class="tagcutflag"><center><img src="ссылка на картинку"></center></a><div style="display: none"> 
<center>Код баннеров </center></div></div>

о1. Установка.
В HTML-верх ставите код:
Код:
<style> 
div .splLink {width: 130px; height: 40px; border: 2px solid #FFD700; background: #FFFFCC; text-align: center; font-family: Comic Sans Ms; font-size: 15px; padding: 5px;}
.spll {width: 130px; height: 70px; }
.spll div .splCont {height: auto; width: 300px; background:  url(https://forumupload.ru/uploads/0003/83/96/1556-1.png); padding: 5px; z-index: 1000; margin-top: 5px; border: 2px solid #FFD700; font-size: 12px; font-family: Microsoft Sans Serif; text-align: center;}
</style>

В HTML-низ ставите скрипт:
Код:
<!--Спойлер - контейнер-->
<script type="text/javascript" src="http://szenprogs.ru/scripts/jquery-1.3.2.js"></script>
<script type="text/javascript"> 
  $(document).ready(function(){
    $('.splLink').click(function(){
      $(this).parent().children('div.splCont').toggle('normal');
      return false;
    });
  });
</script>

А это ставите туда, где хотите увидеть само меню (как правило это объявление):
Код:
<center><table style="width: 90%">
<tr>

<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Первый контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Второй контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Третий контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Четвёртый контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Пятый контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Шестой контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>

</tr>
</table></center>

о2. Заполнение меню.
Чтобы заполнить меню своим содержимым, надо обратиться к третьей части кода.

а). По-умолчанию в коде содержится 6 блоков. По своему усмотрению Вы можете изменить это число, добавив новые или удалив какие-либо. Чтобы осуществить это, достаточно размножить (в случае увеличения числа блоков) или удалить (для уменьшения их числа) такой фрагмент:
Код:
<td><div class="spll">
<DIV jQuery1259073801391="4"><div class=splLink href="javscript://" jQuery1259073801391="2">Шестой контейнер</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont jQuery1259073801391="5">
Тут будет что-то</DIV></DIV>
</div></td>

Внимание! Не меняйте НИКАКИЕ числовые значения в этой части кода! В противном случае меню перестанет работать!

б). Чтобы заменить информацию в основных блоках, найдите в коде слова "Первый блок". Замените их на нужное Вам. Это может быть как текстовая информация, так и графическая (картинки). Можно использовать любой HTML.

в). Чтобы заменить информацию в выпадающих блоках, найдите в коде слова "Тут будет что-то" и замените на нужную Вам информацию. Это может быть как текстовая информация, так и графическая (картинки). Можно использовать любой HTML.

о3. Оформление меню.
Оформление выпадающего меню необходимо менять в первой части кода.
Ниже приведены доступные для пользователей изменения в дизайне:

а). 
Код:
div .splLink {width: 130px; height: 40px; border: 2px solid #FFD700; background: #FFFFCC; text-align: center; font-family: Comic Sans Ms; font-size: 15px; padding: 5px;}

Отвечает за дизайн основных блоков.
width: 130px; - ширина основных блоков, в пикселах.
height: 40px; - высота основных блоков, в пикселах.
border: 2px solid #FFD700; - толщина, метод начертаний и цвет границ основных блоков.
background: #FFFFCC; - цвет фона основных блоков.
text-align: center; - выравнивание текста в основных блоках (по-умолчанию: центр).
font-family: Comic Sans Ms; - шрифт в основных блоках меню.
font-size: 15px; - размер текста в основных блоках меню.
padding: 5px; - отступ от краёв основных блокв (поля).

б). 
Код:
.spll {width: 130px; height: 70px; }

Не рекомендовано для изменения неопытным пользователям!
Замечание: width: 130px; менять одновременно с предыдущим значением ширины (ширина основных блоков).
в). 
Код:
.spll div .splCont {height: auto; width: 300px; background:  url(https://forumupload.ru/uploads/0003/83/96/1556-1.png); padding: 5px; z-index: 1000; margin-top: 5px; border: 2px solid #FFD700; font-size: 12px; font-family: Microsoft Sans Serif; text-align: center;}

Отвечает за дизайн выпадающих блоков.
height: auto; - высота выпадающих блоков. По-умолчанию осуществляется автоподгон по ширине. При необходимости можно заменить auto на любое числовое значение с указанием единиц измерения.
width: 300px; - ширина выпадающих блоков.
background:  url(https://forumupload.ru/uploads/0003/83/96/1556-1.png); - фоновое изображение выпадающих блоков. При необходимости можно установить непрозрачный цвет, путём замены на background: #FFFFCC; с указанием нужного цвета.
padding: 5px; - отступ от краёв выпадающих блокв (поля).
z-index: 1000; не рекомендовано к изменению. Данный параметр отвечает за наложение выпадающих блоков на форум. При уменьшении этого значения меню будет открывыться под таблицу форума. Если какой-либо элемент форума закрывает собой выпадающии меню, это значение необходимо увеличить.
margin-top: 5px; - отступ, между основными и выпадающими блоками. При значении 0 - без отступа.
border: 2px solid #FFD700; - толщина, метод начертаний и цвет границ выпадающих блоков.
font-size: 12px; - размер текста в выпадающих блоках меню.
font-family: Microsoft Sans Serif; - шрифт в выпадающих блоках меню.
text-align: center; - выравнивание текста в выпадающих блоках (по-умолчанию: центр).

Внимание! Производить какие-либо изменения во второй части кода ЗАПРЕЩЕНО!