как нельзя?! капеец

от)

спасибо!

Т.е. картинка становиться более ясной, вы про это? Или похожее, в общем.

Банальный код. вставляем вверх (или вниз, как удобнее)
<!--кнопки вверх вниз-->
<div class="go-up" id='ToTop'><img src="КАРТИНКА ВЕРХНЕЙ" border="0" /></div>
<div class="go-down" id='OnBottom'><img src="КАРТИНКА НИЖНЕЙ" border="0" /></div>
<style>
.go-up,.go-down {
display:none;
position:fixed; /*позиционируем*/
right:5px; /*указываем положение, если слева - left*/
z-index:9999; /*показываем поверх все элементов на странице*/
cursor:pointer;
opacity:.7; /*прозрачность*/
margin-bottom:5px; /*отступ снизу (можно не указывать)*/
width:РАЗМЕРpx; /*ширина кнопки*/
height:РАЗМЕРpx; /*высота кнопки*/
}
.go-up {
bottom:115px; /*положение от низа окна браузера верхняя кнопка*/
}
.go-down {
bottom:25px; /*положение от низа окна браузера нижняя кнопка кнопка*/
}
.go-down:hover,.go-up:hover {
opacity:1;
}
</style>

Что именно вы имеете под фразу "навигация внизу". подробнее опишите.

благодарна была бы за + в профиль =)

Ясно...
Это ставим в ксс структуру
.tooltip {
position: relative;
}
.tooltip em {
display: none;
}
.tooltip:hover em {
font-style: normal;
display: block;
position: absolute;
   background-image : url(КАРТИНКА ФОНА);
color: #ЦВЕТ ТЕКСТА;
padding: 15px 15px;
bottom: 20px;
right: 20px;
box-shadow: 0 0 7px #000000; ПС: ЦВЕТ ТЕНИ БЛОКА!!!
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-webkit-box-shadow: 0 0 20px #000000;
-moz-box-shadow: 0 0 20px #000000;
}
.tooltip:hover em i {
position: absolute;
bottom: -7px;
right: 5px;
border-top: 7px solid #000;
border-left: 7px solid transparent;
display: block;
А это уже туда, куда вам нужно:
<span class="tooltip"><a href="ССЫЛКА"><img src="КАРТИНКА СТАТИЧНАЯ"></a><em><img src="ВЫПРЫГИВАЮЩАЯ КАРТИНКА"> <br></em></span>
ВМЕСТО КАРТИНКИ МОЖЕТ БЫТЬ ЧТО УГОДНО-ТЕКСТ, ССЫЛКА И ТД

poulpe.
Третье и 4 дам завтра днем.
В 3 на самом деле это простая выскакивающая табличка-слайдер. Просто вместо картинок-буква. код найду-завтра дам
В 4 обычный скрипт, прописанный в ксс =) Тоже постараюсь отыскать и дать код

Поехали разбираться
Ксс структура
   Эта част отвечает за те блоки, что выскакивают
.nav {
        opacity: 0;
        font-family: НАЗВАНИЕ ШРИФТ;
        font-size: РАЗМЕРpx;
        text-transform: uppercase; ВИД ШРИФТА СЕЙЧАС СТОИТ-ВСЕ ЗАГЛАВНЫЕ
        border: 1px solid #ЦВЕТ ОБВОДКИ;
        border-radius: 5px;
        color: #432113;
        background-color: #ЦВЕТ ФОНА;
        width: auto;
        margin-top:0px;
        padding:5px 5px 3px 5px;
        text-align: center;
        transition: 0.6s;
        -moz-transition: 0.6s;
        -webkit-transition: 0.6s;
    }
    .n2:hover .nav { margin-top: 20px; opacity: 1; }
    .n3:hover .nav { margin-top: 20px; opacity: 1; }
    .n4:hover .nav { margin-top: 20px; opacity: 1; }
    .n5:hover .nav { margin-top: 20px; opacity: 1; }
     
    .navt {
        position: absolute;
        z-index: 1;
        color: #ЦВЕТ ШРИФТА;
        font-size: РАЗМЕР ТЕКСТАpx;
        text-shadow: 0 -2px 0 #ЦВЕТ ТЕНИ;
        margin-top: -12px;
        margin-left: 18px;
    }

Эта часть отвечает за блоки с буквами

    .navigate { width: auto;margin: 5px 0 0 0; }
    .n2, .n3, .n4, .n5 {
        width: ШИРИНАpx;
        height: ВЫСОТАpx;
        float: left;
        font-family: НАЗВАНИЕ ШРИФТА;
        font-size: 8px;
        text-transform: uppercase;ВИД ШРИФТА СЕЙЧАС СТОИТ-ВСЕ ЗАГЛАВНЫЕ
        text-align: center;
        line-height: 11px;
        transition: 0.6s;
        -moz-transition: 0.6s;
        -webkit-transition: 0.6s;
    }
    .n2 { background-color: #ЦВЕТ ЗАДНЕГО ФОНА; color: #Цвет текста; }
    .n3 { background-color: #ЦВЕТ ЗАДНЕГО ФОНА; color: #Цвет текста; }
    .n4 { background-color: #ЦВЕТ ЗАДНЕГО ФОНА; color: #Цвет текста; }
    .n5 { background-color: #ЦВЕТ ЗАДНЕГО ФОНА; color: #Цвет текста; }
    .n1:hover, .n2:hover, .n3:hover, .n4:hover, .n5:hover {
        background-color: #ЦВЕТ ЗАДНЕГО ФОНА ; color: #ЦВЕТ Текста;
    }

________
Теперь пояснения: все курсивные записи нужно убрать, все жирные заменить.

Это мы ставим в таблицу или куда вам нужно:
<div style="width: ШИРИНА ТАБЛИЧКИpx; height: auto; border: none; top: СМЕЩЕНИЕ ОТНОСИТЕЛЬНО ВЕРХАpx; margin-left: СМЕЩЕНИЕ ВЛЕВОpx; position: absolute; ">
<div align="center" class="navigate">
    <a href="Ссылка"><div class="n2">буква1<div class="nav">текст</div></div></a>
    <a href="Ссылка"><div class="n3">буква 2<div class="nav">текст</div></div></a>
    <a href="Ссылка"><div class="n4">буква3<div class="nav">текст</div></div></a>
    <a href="Ссылка"><div class="n5">буква4<div class="nav">текст</div></div></a>
<a href="Ссылка"><div class="n2">буква5<div class="nav">текст</div></div></a>
    <a href="Ссылка"><div class="n3">буква6<div class="nav">текст</div></div></a>
    <a href="Ссылка"><div class="n4">буква7<div class="nav">текст</div></div></a>
    <a href="Ссылка"><div class="n5">буква8<div class="nav">текст</div></div></a>
    <a href="Ссылка"><div class="n4">буква9<div class="nav">текст</div></div></a>
    </div></div>

Теперь общее пояснение. Мы часто видим в коде такие странные буквы, как n1-n5, в ксс мы задаем им фоны, а в таблицу просто указываем этот класс, и фон, заданный в ксс, будет принадлежать чисто этой ячейке =)

Здравствуйте, можно к вам с просьбой обратиться?
Кто может такую таблицу сделать? Исходники я предоставить могу, как и ссылку на форум.

Посередине меню навигации по самой таблицы, т.е. нажимаешь, например, на "Офицеры" и справа в свитке тебе выдается состав администраторов, модераторов и так далее. (картинка, а напротив имя).
В левом свитке все время контейнер с текстом (информация о рейтинге ролевой, "добро пожаловать" и бла-бла-бла).
В правом свитке, после нажатия "Навигации", будут ссылки с важными темами.
Ссылки в меню подсвечиваются при ховере, как на примере показано.

Отредактировано Mageska (18-02-2014 15:21:14)

morgan
Пост 20. Вроде там я тек слюнями на оформление профиля ._.

morgan
Хорошо, уже отослала.

morgan
Хм. А какой параметр отвечает за строку "поделиться"? pl-share?
Что бы скрыть его можно ж написать display:none?
Или к нему нужен особый подход?

Отредактировано Кейта. (18-02-2014 18:22:25)

Цисса
Да, дизайн готов полностью, осталось только заполнить этот самый форум темами, исходники для таблицы есть, конечно же.

А уже отослала иходники morgan, но что-то она пока молчит. Могу прислать и вам, может, что получится.

Цисса

Признаю, не умею определять пол человека по его нику. Извиняюсь.  :stupor:

Хорошо, сейчас все отошлю в лс.

Цисса

В невнимательности мне тоже нет равных...