ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка

Объявление

Загадочный Дом «Кузнечик»

Форумные игры, кино, позитивное отношение и душевное общение!
Есть в мире место, где душе тепло...
Заходи, мы будем тебе рады!

Подробнее

Мийрон

Качественный пиар быстро и недорого.
Красивейшие дизайны по низким ценам.
Каталог ролевых игр.

Подробнее

Дизайн «Warlords of Draenor»

Детализированный rpg-дизайн для MyBB форума гильдии «Warlords of Draenor»
Стоимость при покупке эксклюзивно: 6300р
В стоимость входит настройка и корректировка дизайна под ваш проект.

Подробнее

Светлый дизайн в фентези стиле с аниме-графикой

Макет для светлого дизайна в фентези стиле с аниме-графикой.
Стоимость: 2600р*
Дизайн продается эксклюзивно (в одни руки).

Подробнее

Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Реклама на сайте
Стать модераторомОтзывы

Предложения

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.



Боковая панель.Марвел.

Сообщений 1 страница 10 из 28

1

1. Ссылка на форум:http://lokirol.rusff.ru/
2. Эскиз таблицы: http://s6.uploads.ru/t/xjizl.png

3. Дополнительные предпочтения: фон внутри посветлее,чем фон форума.

Кнопка-картинка

http://s7.uploads.ru/t/0ARG8.png

0

2

если не открывается

http://s6.uploads.ru/ClOpd.png

вот эти вкладки Вертикальный "аккордеон"

0

3

Ария
Принимаю. Не уверена, но попробовать стоит) К понедельнику будет http://uploads.ru/i/g/p/f/gpfN7.gif

0

4

Ария
Получилось только так отодвинуть, ибо при изменении разрешения оно остается на прежнем месте оО
Если нужны скрипты, которые вы не можете установить/найти и тп.(мало ли), то напишите - поставлю в код http://uploads.ru/i/7/H/w/7Hwsf.gif

Код:
<div id="accordion" style="margin: -530px 0 0 -110px;"> 
    <div class="item">
      <a href="#">Раздел 1</a>
      <p>
      Lorem ipsum nec ex prompta tractatos.
      Ea elit sale admodum vim, at velit nemore rationibus per.
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei.
      Mel legere mucius ne, adhuc impetus signiferumque cu eos.
      Has an zzril soluta impetus.
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 2</a>
      <p>
      Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 3</a>
      <p>Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 4</a>
      <p>Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
  </div>

<style>

#accordion .item {
    width: 250px;
    height: 30px;
    overflow: hidden;
     
    transition: height ease-in-out 500ms;
    -o-transition: height ease-in-out 500ms;
    -moz-transition: height ease-in-out 500ms;
    -webkit-transition: height ease-in-out 500ms;
     
    background: #ccc;
    border: 1px solid #ccc;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
     
    margin-bottom: 2px;
}
#accordion a {
    display: block;
    height: 20px;
    line-height: 20px;
     
    background: #e6e6e6;
    padding: 5px;
    color: #1e1e1e;
    text-decoration: none;
}
#accordion p {
    height: 150px;
    padding: 5px;
}
#accordion div:hover {
    height: 180px;
}
#accordion div:hover a {
    border-bottom: 1px solid #ccc;
    font-weight: bold;
}
</style>

0

5

Jii-Jo
попробовала на тестовике.
получается, что таблицу тоже двигает, я куда-то не куда вставила?
http://narutoklan2.spybb.ru/

0

6

Ария
Если можно, то код таблицы. можно под хайд 760.

Отредактировано Jii-Jo (08.12.2013 10:41:19)

0

7

Jii-Jo написал(а):

можно под хайд 76

без понятия что это.

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

0

8

Ария
Ставится в объявление, сразу после заключительного дива.

Код:
<ul class="tabs">
    <li class="active"><a href="#tab1">Новости</a></li>
    <li><a href="#tab2">Администрация</a></li>
    <li><a href="#tab3">Обновления</a></li>
</ul>
      <div class="tab_container1">
<div style="display: block;" id="tab1" class="tab_content">
<div class="post-box">
        <div class="post-content">
        <table style="table-layout:fixed;width:100%"><tbody><tr><td><p><span style="display: block; text-align: center"><span style="font-family: Impact">Рады Вас приветствовать на ролевом проекте "Don`t lie"</span><br>Тематика нашей ролевой базируется на событиях комиксов и фильмов MARVEL, также на мотивах скандинавской мифологии. <br>Мы имеем альтернативный сюжет и индивидуальные цепочки квестов для каждого персонажа. <br>Мы принимаем ВСЕХ персонажей вселенной MARVEL и разношерстных не канонов. <br>Возможно создание персонажа-животного.</span></p></td><td><p><img class="postimg" src="http://s7.uploads.ru/t/Kosdt.gif" alt="http://s7.uploads.ru/t/Kosdt.gif"></p></td><td><p><span style="font-size: 16px"><span style="display: block; text-align: center"><span style="font-family: Impact"><span style="color: green">Нужные ссылки : </span></span><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=12" rel="nofollow" target="_blank">Правила</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=4" rel="nofollow" target="_blank">Способности</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=32#p82" rel="nofollow" target="_blank">Акции</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=31#p124" rel="nofollow" target="_blank">Сюжетквесты</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/register.php" rel="nofollow" target="_blank">Самое важное</a></span></span></p></td></tr></tbody></table>
        </div>
</div>
                               
</div>
<div style="display: none;" id="tab2" class="tab_content">
<div class="post-box">
        <div class="post-content">
        <p><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/profile.php?id=2" rel="nofollow" target="_blank"><span style="font-family: Impact"><span style="color: green">Himera Lucescere</span></span></a> <span style="font-family: Lucida Console">- создатель, гл.админ, по сути своей беззлобное,но строгое существо. Обожает, выдумывать безумные квесты.<br>По всем вопросом обращать к ней. Единственные человек, которые понимает в чем суть сюжета.</span><br>Связь: <a href="http://lokirol.rusff.ru/click.php?http://vk.com/id108073628" rel="nofollow" target="_blank">ВКонтакте</a><br></p>
        <p><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/profile.php?id=4" rel="nofollow" target="_blank"><span style="font-family: Impact"><span style="color: green">Кэт</span></span></a> <span style="font-family: Lucida Console">- юный энтузиаст,активно помогает на форуме, хороший советчик. Смекает в графических кодах и дизайне.</span><br><span style="font-family: Lucida Console">Связь:</span>  <a href="http://lokirol.rusff.ru/click.php?http://vk.com/id213095366" rel="nofollow" target="_blank">Вконтакте</a></p>
        <p><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/profile.php?id=7" rel="nofollow" target="_blank"><span style="font-family: Impact"><span style="color: green">Thor Odinson</span></span></a> <span style="font-family: Lucida Console">- единственный серьезный человек на форме в настоящее время. Да, это тот герой, который разобрал раздел "Способности" и акцию. Благодарим за проделанную работу)<br></span></p>
        <p>Связь: <a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/messages.php?action=new&uid=7" rel="nofollow" target="_blank">ЛС</a></p>
        </div>
</div>
                               
</div>
<div style="display: none;" id="tab3" class="tab_content"> 

<div class="post-box">
        <div class="post-content">
        <table style="table-layout:fixed;width:100%"><tbody><tr><td><p><span style="font-family: Lucida Console"><strong><span style="display: block; text-align: center">Всегда и везде</span> </strong></span><br><span style="display: block; text-align: center">Мы постарались оптимизировать работу нашего форума через иные гаджеты, например телефоны, планшеты, нетбуки.<br>Мы справляемся с проблемой маленьких экранов, теперь любой блок форума <strong>можно свернуть</strong>, вплоть до категорий.<br>Для это кликните на иконку справа от категорийблоков.<br></span></p></td><td><p><span style="display: block; text-align: center"><span style="font-family: Lucida Console"><span style="font-size: 14px"><strong>Награды</strong></span></span><br>На форуме функционирует ряд новых наград, уже имеется первый награжденный)<br>Спешите оценить их красоту и постарайтесь заполучить одну из <a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/mod/awards/" rel="nofollow" target="_blank">них</a> </span></p></td></tr></tbody></table>
        </div>
</div>
</div>
      </div>



<div id="accordion" style="margin: -230px 0 0 -270px;"> 
    <div class="item">
      <a href="#">Раздел 1</a>
      <p>
      Lorem ipsum nec ex prompta tractatos.
      Ea elit sale admodum vim, at velit nemore rationibus per.
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei.
      Mel legere mucius ne, adhuc impetus signiferumque cu eos.
      Has an zzril soluta impetus.
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 2</a>
      <p>
      Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 3</a>
      <p>Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 4</a>
      <p>Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
  </div>

<style>

#accordion .item {
    width: 250px;
    height: 30px;
    overflow: hidden;
     
    transition: height ease-in-out 500ms;
    -o-transition: height ease-in-out 500ms;
    -moz-transition: height ease-in-out 500ms;
    -webkit-transition: height ease-in-out 500ms;
     
    background: #ccc;
    border: 1px solid #ccc;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
     
    margin-bottom: 2px;
}
#accordion a {
    display: block;
    height: 20px;
    line-height: 20px;
     
    background: #e6e6e6;
    padding: 5px;
    color: #1e1e1e;
    text-decoration: none;
}
#accordion p {
    height: 150px;
    padding: 5px;
}
#accordion div:hover {
    height: 180px;
}
#accordion div:hover a {
    border-bottom: 1px solid #ccc;
    font-weight: bold;
}
</style>

0

9

Jii-Jo
http://lokirol.rusff.ru

0

10

Ария
А если так?

Код:
<ul class="tabs">
    <li class="active"><a href="#tab1">Новости</a></li>
    <li><a href="#tab2">Администрация</a></li>
    <li><a href="#tab3">Обновления</a></li>
</ul>
      <div class="tab_container1">
<div style="display: block;" id="tab1" class="tab_content">
<div class="post-box">
        <div class="post-content">
        <table style="table-layout:fixed;width:100%"><tbody><tr><td><p><span style="display: block; text-align: center"><span style="font-family: Impact">Рады Вас приветствовать на ролевом проекте "Don`t lie"</span><br>Тематика нашей ролевой базируется на событиях комиксов и фильмов MARVEL, также на мотивах скандинавской мифологии. <br>Мы имеем альтернативный сюжет и индивидуальные цепочки квестов для каждого персонажа. <br>Мы принимаем ВСЕХ персонажей вселенной MARVEL и разношерстных не канонов. <br>Возможно создание персонажа-животного.</span></p></td><td><p><img class="postimg" src="http://s7.uploads.ru/t/Kosdt.gif" alt="http://s7.uploads.ru/t/Kosdt.gif"></p></td><td><p><span style="font-size: 16px"><span style="display: block; text-align: center"><span style="font-family: Impact"><span style="color: green">Нужные ссылки : </span></span><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=12" rel="nofollow" target="_blank">Правила</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=4" rel="nofollow" target="_blank">Способности</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=32#p82" rel="nofollow" target="_blank">Акции</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/viewtopic.php?id=31#p124" rel="nofollow" target="_blank">Сюжетквесты</a><br><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/register.php" rel="nofollow" target="_blank">Самое важное</a></span></span></p></td></tr></tbody></table>
        </div>
</div>
                               
</div>
<div style="display: none;" id="tab2" class="tab_content">
<div class="post-box">
        <div class="post-content">
        <p><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/profile.php?id=2" rel="nofollow" target="_blank"><span style="font-family: Impact"><span style="color: green">Himera Lucescere</span></span></a> <span style="font-family: Lucida Console">- создатель, гл.админ, по сути своей беззлобное,но строгое существо. Обожает, выдумывать безумные квесты.<br>По всем вопросом обращать к ней. Единственные человек, которые понимает в чем суть сюжета.</span><br>Связь: <a href="http://lokirol.rusff.ru/click.php?http://vk.com/id108073628" rel="nofollow" target="_blank">ВКонтакте</a><br></p>
        <p><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/profile.php?id=4" rel="nofollow" target="_blank"><span style="font-family: Impact"><span style="color: green">Кэт</span></span></a> <span style="font-family: Lucida Console">- юный энтузиаст,активно помогает на форуме, хороший советчик. Смекает в графических кодах и дизайне.</span><br><span style="font-family: Lucida Console">Связь:</span>  <a href="http://lokirol.rusff.ru/click.php?http://vk.com/id213095366" rel="nofollow" target="_blank">Вконтакте</a></p>
        <p><a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/profile.php?id=7" rel="nofollow" target="_blank"><span style="font-family: Impact"><span style="color: green">Thor Odinson</span></span></a> <span style="font-family: Lucida Console">- единственный серьезный человек на форме в настоящее время. Да, это тот герой, который разобрал раздел "Способности" и акцию. Благодарим за проделанную работу)<br></span></p>
        <p>Связь: <a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/messages.php?action=new&uid=7" rel="nofollow" target="_blank">ЛС</a></p>
        </div>
</div>
                               
</div>
<div style="display: none;" id="tab3" class="tab_content"> 

<div class="post-box">
        <div class="post-content">
        <table style="table-layout:fixed;width:100%"><tbody><tr><td><p><span style="font-family: Lucida Console"><strong><span style="display: block; text-align: center">Всегда и везде</span> </strong></span><br><span style="display: block; text-align: center">Мы постарались оптимизировать работу нашего форума через иные гаджеты, например телефоны, планшеты, нетбуки.<br>Мы справляемся с проблемой маленьких экранов, теперь любой блок форума <strong>можно свернуть</strong>, вплоть до категорий.<br>Для это кликните на иконку справа от категорийблоков.<br></span></p></td><td><p><span style="display: block; text-align: center"><span style="font-family: Lucida Console"><span style="font-size: 14px"><strong>Награды</strong></span></span><br>На форуме функционирует ряд новых наград, уже имеется первый награжденный)<br>Спешите оценить их красоту и постарайтесь заполучить одну из <a href="http://lokirol.rusff.ru/click.php?http://lokirol.rusff.ru/mod/awards/" rel="nofollow" target="_blank">них</a> </span></p></td></tr></tbody></table>
        </div>
</div>
</div>
      </div>



<div id="accordion" style="margin: -830px 0 0 -270px; min-height: 810px;"> 
    <div class="item">
      <a href="#">Раздел 1</a>
      <p>
      Lorem ipsum nec ex prompta tractatos.
      Ea elit sale admodum vim, at velit nemore rationibus per.
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei.
      Mel legere mucius ne, adhuc impetus signiferumque cu eos.
      Has an zzril soluta impetus.
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 2</a>
      <p>
      Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 3</a>
      <p>Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
    <div class="item">
      <a href="#">Раздел 4</a>
      <p>Lorem ipsum nec ex prompta tractatos. 
      Ea elit sale admodum vim, at velit nemore rationibus per. 
      Ullum qualisque dissentias ei qui, in putent doctus cotidieque mei. 
      Mel legere mucius ne, adhuc impetus signiferumque cu eos. 
      Has an zzril soluta impetus. 
      An nisl graece inciderint nec, ea per rebum animal, prodesset accommodare ex eam.
      </p>
    </div>
  </div>

<style>

#accordion .item {
    width: 250px;
    height: 30px;
    overflow: hidden;
     
    transition: height ease-in-out 500ms;
    -o-transition: height ease-in-out 500ms;
    -moz-transition: height ease-in-out 500ms;
    -webkit-transition: height ease-in-out 500ms;
     
    background: #ccc;
    border: 1px solid #ccc;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
     
    margin-bottom: 2px;
}
#accordion a {
    display: block;
    height: 20px;
    line-height: 20px;
     
    background: #e6e6e6;
    padding: 5px;
    color: #1e1e1e;
    text-decoration: none;
}
#accordion p {
    height: 150px;
    padding: 5px;
}
#accordion div:hover {
    height: 180px;
}
#accordion div:hover a {
    border-bottom: 1px solid #ccc;
    font-weight: bold;
}
</style>

0