Virginia Banks написал(а):

Эскиз

2) Ссылка на ваш форум !Заказы без ссылок приниматься не будут! - http://warriorstest.rusff.ru/
3) Указать необходимые прокрутки, всплывающие окна, границы таблиц и т.п. - фон самой таблицы должен быть кварцевого цвета, то есть такой - #917e72, сам текст должен быть либо черного цвета. Время должно само меняться, в смысле, когда тыкаешь на контейнер с "время и погода в игре" то там стоит время, например, сезон Зеленых Листьев, утро (1 день) - на следующий день так "Сезон Зеленых Листьев, утро ( 2 день)" и так далее о.о
Контейнер "Администрация":
Сначала "Главный Администратор" ниже ссылка на профиль админа, дальше "Администраторы", также ниже ссылки на профиля админов, и "Модераторы" - тоже самое.
В рекламе сначала идет текст, потом баннеры!
Навигация. Там должно быть куча ссылок.
Вроде все о.о
И еще. Фон контейнеров, в смысле когда они уже выдвинуты, должен быть льняного цвет - #faf0e6 и слегка прозрачным. Текст - также черным.
И да, еще кое-что. Текст не должен идти как бы сплошным текстом о.о Я имею виду, что разными абзацами должны быть пробелы как бэ. В общем, когда заливаешь текст в таблицу - не важно в контейнера или нет - то можно было легко и просто нажать Enter. пф.
и кстати, про картинку. Пусть ее размер будет 350х350.

<style type="text/css">
/*скрытие слова "Объявление"*/
#pun-announcement h2 {
    display: none;
    }

/*фон таблицы*/
#obyava {
   position: relative;
   width: 900px;
   height: 426px;
   background-color: #917e72;
   }

/*гостям форумчанам*/
.guests-users {
   width: 260px;
   height: 360px;
   overflow-y: auto;
   text-align: center;
   }
</style>

<style>
/*блоки-кнопки с заголовками для выпадающих меню*/
div .splLink {
    width: 190px;
    height: 22px;
    border: 1px solid #68564A; /*цвет рамок*/
    background-color: #917e72; /*цвет фона*/
    text-align: center;
    padding: 5px;
    font: bold 15px 'palatino linotype'; /*настройки шрифта*/
   }

.spll {
    width: 200px;
    height: 35px;
    margin: 0px auto;
    }

/*выпадающие блоки*/
.spll div .splCont {
    height: auto;
    width: 190px;
    border: 1px solid #68564A; /*цвет рамок*/
    background-color: #faf0e6; /*цвет фона*/
    text-align: center;
    opacity: 0.7; /*прозрачность*/
    padding: 5px;
    z-index: 1000;
    margin-top: 0px;
    font: normal 12px; /*настройки шрифта*/
   }
</style>

<!--Спойлер - контейнер-->
<script type="text/javascript">
  $(document).ready(function(){
    $('.splLink').click(function(){
      $(this).parent().children('div.splCont').toggle('normal');
      return false;
    });
  });
</script>

<div id=obyava>
   <center><br>
      <table style="width: 97%">
         <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">
    <style>#PrognosRotator p{display:none}</style>

    <div id="PrognosRotator" style="width:180px;"><!-- Ротатор произвольного контента -->

    <p>Сезон Зеленых Листьев, утро (1 день)<br>Погода первая<br><img src="http://limg.imgsmail.ru/s/images/informers/weather/med41/mooncloud.png"/></p>

    <p>Сезон Зеленых Листьев, утро (2 день)<br>Погода вторая<br><img src="http://pogoda.mail.ru/img/status/png/weather/big57/d6.png"/></p>

    <p>И так далее придумываете свои сезоны</p>

    </div>

    <script type="text/javascript">
    var RandArray=[
    103,242,99,335,449,554,662,430,595,588,668,225,244,23,659,683,624,454,62,250,
    213,427,426,507,532,604,362,301,149,403,512,72,492,436,252,491,602,525,44,150,
    465,74,527,181,408,444,511,276,503,655,541,75,202,486,118,276,129,26,244,487,
    280,388,251,604,592,272,522,294,179,543,37,453,567,578,184,262,390,683,380,340,
    305,10,153,566,219,14,321,211,542,111,596,307,691,134,583,449,207,554,573,412,
    412,511,427,328,478,154,175,665,193,264,674,595,436,628,245,407,456,620,387,595,
    316,148,237,516,543,1,481,634,63,202,226,240,565,438,375,585,591,44,396,620,
    545,560,174,397,666,316,644,443,155,513,230,176,386,206,671,527,382,274,533,615,
    42,561,76,267,633,402,8,92,23,157,386,145,135,542,424,19,224,212,500,157,
    337,460,469,537,461,33,234,615,642,630,74,328,171,264,120,400,452,264,346,349,
    100,673,524,84,228,46,546,450,197,42,646,624,30,216,607,385,24,566,215,536,
    359,176,240,20,675,313,300,366,647,638,578,327,208,160,296,221,163,170,137,119,
    338,194,234,307,98,648,490,380,98,549,397,565,433,295,278,123,326,87,613,524,
    120,524,600,45,35,170,695,218,529,461,256,591,444,224,623,560,546,375,589,622,
    436,222,410,370,192,582,582,53,651,535,452,377,294,176,251,593,214,206,94,699,
    308,588,255,279,409,146,658,46,222,228,5,502,310,37,122,510,441,362,396,173,
    552,46,15,113,229,407,427,486,368,444,290,55,515,526,385,483,508,679,289,433,
    572,394,542,27,31,647,168,147,335,403,404,501,630,34,180,111,257,210,430,214,
    406,74,328,672,267,49,227,401,403,280,293,650,197,48,431,255,204,296,320,596,
    351,269,141,667,541,175,601,231,360,606,84,14,439,489,543,109,625,110,160,47,
    537,308,668,504,440,5,644,473,389,608,668,346,500,192,104,202,634,432,317,241,
    171,527,697,281,152,377,249,648,298,577,217,167,525,412,671,321,94,562,565,579,
    524,491,131,576,634,633,619,94,93,202,592,662,542,413,173,115,263,642,441,16,
    277,300,73,140,608,228,595,689,162,337,659,343,477,302,591,200,11,69,521,490,
    209,171,657,394,160,43,199,276,25,365,685,530,47,485,695,262,64,15,673,385,
    596,565,441,47,634,26,87,620,483,17,147,367,566,118,568,348,640,523,525,595,
    479,356,322,525,57,185,485,39,184,196,336,631,155,137,697,285,590,284,493,438,
    330,13,384,243,229,595,91,160,524,204,510,640,504,438,393,56,223,374,402,208,
    693,406,34,482,491,294,685,24,696,616,698,54,357,81,249,602,169,169,484,164,
    71,386,37,390,498,418,249,650,301,107,115,447,673,128,555,691,694,84,194,263,
    80,396,306,549,371,416,62,689,209,674,636,576,118,604,533,40,117,512,325,652,
    414,518,689,280,373,143,593,54,2,637,185,638,241,352,340,80,275,417,94,543,
    31,393,630,373,555,245,365,242,54,557,503,319,290,545,86,626,606,511,539,334,
    118,503,551,408,30,209,600,272,1,661,302,286,80,587,343,124,655,396,621,260,
    242,99,335,449,554,662,430,595,588,668,225,244,23,659,683,624,454,62,250,310,
    ];
    var today = new Date().getTime();
    a=Math.floor(today/(1000*60*60*24*1)); //1 - кол-во суток, через которые меняется
    a=a-Math.floor(a/700)*700;
    var Nrout=$("#PrognosRotator p").length;
    a=Math.floor(Nrout*(RandArray[a]+1)/700)
    RotatorMycontent(a);
    function RotatorMycontent(i) {
    $("#PrognosRotator p").hide();
    $("#PrognosRotator p").eq(i).show();
    }
    </script>
                     </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">
Главный администратор<br>
<img src="http://forumavatars.ru/img/avatars/0000/14/1c/29291-1376501251.jpg"/><br>
<a href="http://warriorstest.rusff.ru/">Ссылка на профиль</a><br>

Администраторы<br>
<table style="margin:auto">
<tr>
<td>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
<a href="http://warriorstest.rusff.ru/">Профиль 1</a>
</td>
<td>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
<a href="http://warriorstest.rusff.ru/">Профиль 2</a>
</td>
</tr>
</table>

Модераторы<br>
<table style="margin:auto">
<tr>
<td>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/new.gif"/><br>
<a href="http://warriorstest.rusff.ru/">Профиль 3</a>
</td>
<td>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/new.gif"/><br>
<a href="http://warriorstest.rusff.ru/">Профиль 4</a>
</td>
<td>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/new.gif"/><br>
<a href="http://warriorstest.rusff.ru/">Профиль 5</a>
</td>
</tr>
</table>
                     </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">
Текст<br><br>
<a href="http://catswarriorshope.mybb.ru " target=_blank> <img src="http://belayazvezda.ucoz.ru/_fr/21/2360803.gif" border="0" alt="КВВН Заходи!" width="80" height="31"></a>
                     </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">
<a href="http://warriorstest.rusff.ru/">Полезные</a><br>
<a href="http://warriorstest.rusff.ru/">Ссылки</a><br>
<a href="http://warriorstest.rusff.ru/">И</a><br>
<a href="http://warriorstest.rusff.ru/">Навигация</a><br>
<a href="http://warriorstest.rusff.ru/">По</a><br>
<a href="http://warriorstest.rusff.ru/">Форуму</a>
                     </DIV>
                  </DIV>
               </div>
            </td>

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

<br>
<table style="width:880px; height:360px; margin:auto"; align=center>
   <tr>
      <td width="260">
         <div class="guests-users">
Дорогие форумчане!<br><br>
Ваш текст. Ваш текст. Ваш текст. Ваш текст. Ваш текст.Ваш текст.Ваш текст.Ваш текст. Ваш текст. Ваш текст. Ваш текст. Ваш текст. Ваш текст.Ваш текст.Ваш текст.Ваш текст. Ваш текст. Ваш текст. Ваш текст. Ваш текст. Ваш текст.Ваш текст.Ваш текст.Ваш текст.
         </div>
      </td>
      <td width="360"; align=center>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/new.gif"/>
      </td>
      <td width="260">
         <div class="guests-users">
Уважаемые гости!<br><br>
Ваш текст. Ваш текст. Ваш текст. Ваш текст. Ваш текст.Ваш текст.Ваш текст.Ваш текст.<br><br>
<a href="http://warriorstest.rusff.ru/">Ссылка 1</a><br>
<a href="http://warriorstest.rusff.ru/">Ссылка 2</a><br>
<a href="http://warriorstest.rusff.ru/">Ссылка 3</a><br><br>
Ваш текст. Ваш текст. Ваш текст. Ваш текст. Ваш текст.Ваш текст.Ваш текст.Ваш текст.
         </div>
      </td>
   </tr>
</table>

<div>

Темно-зеленым - наполнение вашего ротатора погоды. Сюда, как видите, можно ставить текст, картинки, делать таблицы, переводы строк (enter) - последние и так есть там, это теги <br>. Перед контентом, который должен оказаться на новой строчке, поставьте упомянутый тег, он перенесет следующий за ним контент на новую строку. Все, что заключено в синих тегах <p>...</p> - ваша погода на один день. Ниже еще пара таких тегов с новым наполнением - второй день. Еще одна пара - третий день и так далее.
Выделенное фиолетовым - ссылки на картинки администраторов.
Выделенное розовым - ссылки на картинки модераторов.
Выделенное подчеркиванием - блок под картинку и ссылку на профиль одного модератора или администратора. Нужны еще админо-модеры - добавьте такой блок,
лишние - удалите.
Оливковым - код баннера для примера. Ставите свой и в той же строке (если нужно рядом) вставляете еще один. Если баннеры нужны в столбик после кода каждого, после которого должен быть перевод строки, ставите волшебный тег <br>.
Салатовым - ссылка на центральную картинку 350 на 350 пикселей (которая на эскизе у вас была заказана как 400 на 450)

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

В блоках "для форумчан" и "для гостей" есть вертикальная прокрутка, появляющаяся только при необходимости.

Возможно, вы захотите сократить расстояние до и после Объявления. В таком случае вам нужно будет сходить в Администрирование - Свой стиль - Структура стиля, найти вот эту часть кода:

/* D6.3 */
#pun-announcement .container {
  padding: 4.3em 1em 1em 1em;
  }

И изменить выделенную красным цифру на 1

1. ширина объявления

/*фон таблицы*/
#obyava {
   position: relative;
   width: 902px;
   height: 426px;
   background-color: #917e72;
   }

2. "звездочки" в описаниях

/*блоки-кнопки с заголовками для выпадающих меню*/
div .splLink {
    width: 190px;
    height: 22px;
    border: 1px solid #68564A; /*цвет рамок*/
    background-color: #917e72; /*цвет фона*/
    text-align: center;
    padding: 5px;
    font: bold 15px 'palatino linotype'; /*настройки шрифта*/
   }

3. ширина выпадающих контейнеров; "звездочки" в описаниях

/*выпадающие блоки*/
.spll div .splCont {
    height: auto;
    width: 200px;
    border: 1px solid #68564A; /*цвет рамок*/
    background-color: #faf0e6; /*цвет фона*/
    text-align: center;
    opacity: 0.7; /*прозрачность*/
    padding: 5px;
    z-index: 1000;
    margin-top: 0px;
    font: normal 12px; /*настройки шрифта*/
   }

billy_joe написал(а):

1) Эскиз
2) Ссылка на форум
3) Мне необходим лишь макет этой таблицы: фон, шрифт, картинки и т. п. я вставлю сам. Границ у таблицы нет, под текстом таблицы можно будет поставить картинку(фон текста). Каждый большой прямоугольник - новая картинка. Есть 4 кнопки, под каждой кнопкой идёт текст(подробнее на эскизах). Правая часть таблицы чуть меньше левой(на ваше усмотрение). Сама таблица - примерно 700х350.

<style type="text/css">
/*фон таблицы*/
#obyava {
    width: 778px;
    height: 400px;
    }

/*центральные блоки во 2-й и 3-й вкладках*/
.list-top {
    position: relative;
    width: 470px;
    height: 50px;
    }

/*левые и правые блоки для второй вкладки*/
.list-2-left, .list-2-right {
    width: 220px;
    height: 70px;
    overflow-y: auto;
    }

/*левые и правые блоки в третьей вкладке*/
.list-3-left, .list-3-right {
    width: 220px;
    height: 145px;
    overflow-y: auto;
    }

/*положение и отступы левых блоков*/
.list-2-left, .list-3-left {
    position: absolute;
    margin: 3px 0px 0px 10px;
    }

/*положение и отступы правых блоков*/
.list-2-right, .list-3-right {
    position: relative;
    margin: 3px 0px 0px 232px;
    }
</style>

        <!-- Стиль меню таблицы в объявлении -->
        <style type="text/css">
        /****************************************
           Таблица с переключаемыми Вкладками

        ****************************************/
        #tab2,#tab2*{
          paddibg:0;
          margin:0;
        }
        #tab2 {
          background:transparent url(http://savepic.net/3860170.png) 0 0 no-repeat;
          height: 260px;
          width: 478px;
/*          outline: solid red 1px; Убираем Строку после настройки*/
        }
        #tab2,#tab2 td{
          border: none 0 transparent!important;
          border-collapse: collapse;
        }
        img[data^="tab"]{
          cursor: pointer;
          height: 100%;
/*          outline: solid red 1px; Убираем Строку после настройки*/
          border: none 0 transparent!important;
          margin: 0px 33px;
        }
        .tab-content {
          display: none;
          width: 100%;
          height: 204px;
/*          outline: solid blue 1px; Убираем Строку после настройки*/
/*          color: #fff;*/
          overflow-y: auto;
        }
        </style>
        <script type="text/javascript">
        $.fn.switch_tabs = function() {
          var tbl = this,knopK = $("img[data^='tab']",tbl);
          knopK.each(function(){
            var arr = $(this).attr('data').split(",");
            $(this).css("background-image","url("+arr[1]+")")
          }); knopK.css("background-position","120% 10000px")
              knopK.css("background-repeat","no-repeat")

          knopK.click(function(){
            knopK.removeClass('active');
            $(this).addClass('active');
            var arr = $(this).attr('data').split(",");
            tbl.css("background-image","url("+arr[1]+")")
            $(".tab-content",tbl).hide();
            $("#"+arr[0]+"",tbl).show();
          });
        }
        </script>

<div id="obyava">
   <table width=778px height=400px>
      <tr>
         <td id="taba" width=478px height=60px align=center line-height=150%>
Баннеры текст Баннеры текст Баннеры текст Баннеры текст Баннеры текст Баннеры текст Баннеры текст Баннеры текст<br>
<a href="http://catswarriorshope.mybb.ru " target=_blank> <img src="http://belayazvezda.ucoz.ru/_fr/21/2360803.gif" border="0" alt="КВВН Заходи!" width="80" height="31"></a>
         </td>
         <td id="taba" rowspan=3 width=300px align=center valign=top>

Правая колонка<br>
где<br> Много текста<br> бла-бла-бла<br> сплошной текст<br> где все еще текст<br> и вниз<br> туда<br> дальше<br> текст

         </td>
      </tr>
      <tr>
         <td id="taba" width=478px height=60px align=center>
Баннеры<br>
<a href="http://catswarriorshope.mybb.ru " target=_blank> <img src="http://belayazvezda.ucoz.ru/_fr/21/2360803.gif" border="0" alt="КВВН Заходи!" width="80" height="31"></a>
         </td>
      </tr>
      <tr>
         <td id="taba" width=478px height=260px>

    <table id="tab2" class="tbl-0" border="0">
    <tr>
    <td class="butt" valign=center height=50>   <!-- Секция кнопок -->
    <img width="50" data="tab-1,http://savepic.net/3860170.png" src="/i/blank.gif" class="active"/>
    <img width="50" data="tab-2,http://savepic.net/3860170.png" src="/i/blank.gif"/>
    <img width="50" data="tab-3,http://savepic.net/3860170.png" src="/i/blank.gif"/>
    <img width="50" data="tab-4,http://savepic.net/3860170.png" src="/i/blank.gif"/>
    </td>
    </tr>
    <tr>
    <td  class="content" align=center>
    <!-- Контейнер контента 1-й кнопки -->
    <div id="tab-1" class="tab-content" style="display:block;">

Текст, который открывается сразу при загрузке страницы

    </div>

    <!-- Контейнер контента 2-й кнопки -->

    <div id="tab-2" class="tab-content">
       <div class="list-top">
Текст, который открывается при нажатии на 2-ю кнопку
       </div>
       <div class="list-2-left">
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/>
       </div>
       <div class="list-2-right">
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/>
       </div>
       <div class="list-2-left">
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/>
       </div>
       <div class="list-2-right">
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/>
       </div>
    </div>

    <!-- Контейнер контента 3-й кнопки -->

    <div id="tab-3" class="tab-content">
       <div class="list-top">
Текст, который открывается при нажатии на 3-ю кнопку<br>
Текст, который открывается при нажатии на 3-ю кнопку Текст, который открывается при нажатии на 3-ю кнопку Текст, который открывается при нажатии на 3-ю кнопку
       </div>
       <div class="list-3-left">
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/><br>
Текст и картинки<br>

       </div>
       <div class="list-3-right">
Текст и картинки<br>
<img src="http://st1.bbcorp.ru/img/Mybb_Chance/old.gif"/>
       </div>
    </div>

    <!-- Контейнер контента 4-й кнопки -->
    <div id="tab-4" class="tab-content">

Текст, который открывается при нажатии на 4-ю кнопку

    </div>

    </td>
    </tr>
    </table><script>$("#tab2").switch_tabs()</script><!--//End/-switch Tabs -->

         </td>
      </tr>
   </table>
</div>

Для установки отдельных фонов на каждую вкладку, необходимо создать четыре картинки желаемых размеров (только под кнопки, как сейчас, или под всю таблицу и кнопки) залить их на файлообменник и поставить последовательно вместо выделенных темно-синим ссылок в Объявлении, причем ссылку на картинку для первой вкладки необходимо будет продублировать в html-верхе (она тоже выделена темно-синим). Будут сложности - пишите.

золотая написал(а):

эскиз

о2 http://notfound.spybb.ru/ тестовик
о3 размер, ну, приблизительно 700х350 или где-то в таких рамках. на эскизе, думаю, понятно, что должна быть прокрутка. а так все. удачи и заранее спасибо :3

<style type="text/css">
/*основная таблица*/
#obyava {
    width: 700px;
    height: 350px;
    margin: auto;
    }

/*заголовки на вкладках слайдера*/
.slider-content h3 {
    font: bold 16px 'palatino linotype', serif;
    padding: 5px 0px 5px 0px;
    }
</style>

<link rel="stylesheet" type="text/css" href="http://forumstatic.ru/files/0010/b4/f8/71526.css" />
<script type="text/javascript" src="http://forumstatic.ru/files/0010/b4/f8/78275.js"></script>

<div id="obyava">
    <!-- Cлайдер -->
       <div id="slider2" slide-width="700" slide-height="350" class="slider" style="padding:0; height:0; width:0">

    <!-- Две Кнопки слайдера -->
        <img button-width="42" class="button-left hide" src="http://s3.uploads.ru/KcP7S.png"/>
        <img button-width="42" class="button-right" src="http://s2.uploads.ru/aIH0D.png"/>

    <!-- 1-й Контейнер слайдера -->
    <div class="slider-content active">

<h3>Добро пожаловать</h3>
   <table width="607" height="90%"><tr><td>
Текст Текст по центру
   </td></tr></table>

    </div>
    <!-- 2-й Контейнер слайдера -->
    <div class="slider-content">

<h3>Администрация</h3>
   <table width="607" height="90%"><tr height="40%"><td>
<a href="http://notfound.spybb.ru/"><img src="http://s4.uploads.ru/nz8Xq.jpg"></a>
<a href="http://notfound.spybb.ru/"><img src="http://s4.uploads.ru/nz8Xq.jpg"></a>
<a href="http://notfound.spybb.ru/"><img src="http://s4.uploads.ru/nz8Xq.jpg"></a>
<a href="http://notfound.spybb.ru/"><img src="http://s4.uploads.ru/nz8Xq.jpg"></a>
   </td></tr>
   <tr height="20%"><td>
<a target="top_" title="Рейтинг Ролевых Ресурсов - RPG TOP" href="http://top.roleplay.ru/20743"><img height="31" border="0" width="88" alt="Рейтинг Ролевых Ресурсов - RPG TOP" src="http://img.rpgtop.su/88x31x11x3.gif"></img></a>
   </td></tr>
   <tr height="40%"><td>
<a title="правила" href="http://californiation.rusff.ru/viewtopic.php?id=3#p3"><img src="http://s4.uploads.ru/8NPHi.png"></a>
<a title="правила" href="http://californiation.rusff.ru/viewtopic.php?id=3#p3"><img src="http://s4.uploads.ru/b1JiW.png"></a>
<a title="правила" href="http://californiation.rusff.ru/viewtopic.php?id=3#p3"><img src="http://s5.uploads.ru/QiJw8.png"></a>
<a title="правила" href="http://californiation.rusff.ru/viewtopic.php?id=3#p3"><img src="http://s5.uploads.ru/Jjxg4.png"></a>
<a title="правила" href="http://californiation.rusff.ru/viewtopic.php?id=3#p3"><img src="http://s4.uploads.ru/vtxQ1.png"></a>
<a title="правила" href="http://californiation.rusff.ru/viewtopic.php?id=3#p3"><img src="http://s5.uploads.ru/cb2un.png"></a>
   </td></tr></table>

    </div>
    <!-- 3-й Контейнер слайдера -->
    <div class="slider-content">

<h3>Активисты</h3>
   <table width="607" height="30%"><tr><td>
<img src="http://i44.tinypic.com/2j4yseh.png">
<img src="http://i44.tinypic.com/2j4yseh.png">
<img src="http://i44.tinypic.com/2j4yseh.png">
<img src="http://i44.tinypic.com/2j4yseh.png">
   </td></tr></table>

<h3>Пост дня</h3>
   <table width="607" height="50%"><tr><td>
<img src="http://i41.tinypic.com/168ae09.png">
   </td></tr></table>

    </div>

       </div><script>$("#slider2").slideF();</script><!--//End Cлайдер -->
</div>

Поскольку вы не предоставили картинок стрелочек для переключения слайдов, тут оставлены исходные. Ссылки на них выделены салатовым. Создайте картинки, залейте на файлообменник и поставьте, соответственно, первой левую, второй - правую.
Розовым выделены заголовки на вкладках. Если вы захотите изменить их начертание, размер шрифта, цвет, ищите настройки в html-верхе, они тоже выделены розовым. Если же заголовки вам не нужны, можете удалить их в Объявлении вместе с тегами <h3></h3>.
Темно-синим - код баннера. Не забудьте поставить свой.

Bakanishi написал(а):

эскиз

   

2) http://jutakuoni.clanbb.ru/ форум игровой
3) В принципе таблица не сложная, и если бы я знал, как переставить кнопки из верхней панельки (кол с такой табличкой уже знаком) по бокам как хочу, не обращался бы. Помогите, пожалуйста, переставить кнопочки )
Желательно, чтобы поле текста задавалось одной картинкой, а кнопочки другими. если это важно, конечно.
Спасибо за потраченное время.
информационное поле примерно 660Х200
картинка

кнопочки примерно 120Х60
картинки
общая схема

<style type="text/css">
/*общий контейнер объявления*/
#obyava {
    width: 905px;
    height: 205px;
    margin: auto;
    }

/*контейнеры под кнопки-переключатели*/
#menu, #menu-1 {
    margin-top: 0px;
    width: 120px;
    height: 205px;
    background-repeat: no-repeat;
    }

/*бордюры к кнопкам и фону информблока*/
#submenu, #menu img {
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    background: #430105;
    }

/*кнопки*/
#menu img {
    display: block !important;
    }

/*подсветка кнопок в активном состоянии*/
#menu .tabactive, #menu-1 .tabactive {
    background: #460203;
    }

/*информблок*/
#submenu {
    padding: 3px;
    height: 200px;
    text-align: center;
    font-size: 12px;
    width: 650px;
    background:  url("http://s5.uploads.ru/agw63.png") no-repeat top center;
    }

/**/
.submenutext {
    display: none;
    height: 40px;
    }
</style>

<script type="text/javascript">
$(document).ready(function() {
$("td.#MenuTxT div.submenutext").hide();
<!--$(".tabs span:first").addClass("active").show(); -->
$("td.#MenuTxT div.submenutext:first").show();
$("div.#menu img, div.#menu-1 img").click(function() {
    $("div.#menu img, div.#menu-1 img").removeClass("tabactive");
    $(this).addClass("tabactive");
    $("td.#MenuTxT div.submenutext").hide();
    var activeDiv = $(this).attr("alt");
    $("div."+activeDiv).fadeIn();
    return false; });
});
</script>

<div id="obyava">
    <center><table style="width: 900px">
<tbody>
  <tr>
   <td valign="top">
    <div id="menu">
     <div><img alt="#sm1" src="http://s4.uploads.ru/NlfjD.png" style="cursor: pointer;"/></div>
     <div><img alt="#sm2" src="http://s5.uploads.ru/vrQCs.png" style="cursor: pointer; margin: 9px 0px"/></div>
     <div><img alt="#sm3" src="http://s4.uploads.ru/iCPnD.png" style="cursor: pointer; margin: 9px 0px"/></div>
    </div>
   </td>
   <td id="MenuTxT"  align="center" valign="top">
    <div id="submenu" align="center">
     <div id="sm1" class="submenutext" style="display:block;"><br/><br/>
текст помощь
     </div>
     <div id="sm2" class="submenutext"><br/><br/>
текст новости
     </div>
     <div id="sm3" class="submenutext"><br/><br/>
текст график
     </div>
     <div id="sm4" class="submenutext"><br/><br/>
текст главная
     </div>
     <div id="sm5" class="submenutext"><br/><br/>
текст баннеры
     </div>
     <div id="sm6" class="submenutext"><br/><br/>
текст администрация
     </div>
    </div>
   </td>
   <td valign="top">
     <div id="menu-1">
     <div><img alt="#sm4" src="http://s4.uploads.ru/i4x8A.png" style="cursor: pointer;"/></div>
     <div><img alt="#sm5" src="http://s4.uploads.ru/3fqSC.png" style="cursor: pointer; margin: 5px 0px"/></div>
     <div><img alt="#sm6" src="http://s5.uploads.ru/LIqJV.png" style="cursor: pointer;"/></div>
     </div>
   </td>
</tr>
</tbody>
</table></center>
</div>

Таблица получилась на пять пикселей шире и выше: с теми картинками, что вы предоставили, иначе вписаться было сложно, при условии хотя бы минимальных зазоров между кнопками и кнопками и информ-блоком.
Если возникнут какие-то сложности или неполадки в работе - пишите, будем искать решение