Кофеман, вы немного не поняли. Это не боковая панель... Пробовала я выставлять сайдбар и ужаснулась... С моим стилем оно образует такое убожество, что и думать не стоит! Вы, не могли бы написать код для кнопок, а я уж подумаю как их можно будет вставить...
J.E.V.T., теперь понятно. Выплывающие окна должны быть под кнопками или появляться вбок?
Код с выпадением меню вбок. Стили сами поправите. Если нужна помощь по оформлению, то лучше создайте тему с просьбой.
Это в HTML-верх
<style> /* Стиль всплывающего меню */
.splLink {width: 130px; height: 40px; border: 1px solid #FFD700; text-align: center; font-family: Gothic century; font-size: 15px; padding: 5px;}
.splCont {height: auto; width: 260px; background: #D2B48C; padding: 5px; z-index: 1000; margin-top: -40px; margin-left: 140px; border: 2px solid #D2B48C; font-size: 12px; font-family: Lucida Sans Unicode; text-align: center;}/* Тень, Прозрачка и Скругление углов во Всплывающем меню */
.splCont {background-color: transparent !important; background-image: url("http://savepic.ru/2408258.png");
border-radius:15px;
-webkit-border-radius:15px;
-khtml-border-radius:15px;
-moz-border-radius:15px;
-o-border-radius:15px;box-shadow:0px 5px 14px #8B6C52;
-webkit-box-shadow:0px 5px 14px #8B6C52;
-khtml-box-shadow:0px 5px 14px #8B6C52;
-moz-box-shadow:0px 5px 14px #8B6C52;
}</style>
Это в HTML-низ
<!--Спойлер - контейнер-->
<script type="text/javascript">
$(document).ready(function(){
$('.splLink').click(function(){
$(this).parent().children('div.splCont').toggle('normal');
return false;
});
});
</script>
Это таблица с кнопками. Вставляете туда, куда Вы хотите.
<table width="140">
<tr><td align="center">
<DIV><div class=splLink>К вниманию гостей</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont>Ваш Контент для гостей
</DIV></DIV>
</td></tr>
<tr><td align="center">
<DIV><div class=splLink>К вниманию пользователей</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont>Ваш Контент для пользователей
</DIV></DIV>
</td></tr>
<tr><td align="center">
<DIV><div class=splLink>Новости форума</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont>Ваш Контент новостей
</DIV></DIV>
</td></tr>
<tr><td align="center">
<DIV><div class=splLink>События в игре</div>
<DIV style="DISPLAY: none; position: absolute;" class=splCont>Ваш Контент событий
</DIV></DIV>
</td></tr>
</table>
Красным выделена ширина таблицы, она должна быть = или больше значения заданного в стиле тут - .splLink {width: 130px;
Отредактировано Кофеман (2011-07-06 13:24:54)