Перейти к публикации

Меняющаяся кнопка


Demon2

Рекомендованные сообщения

Подскажите плиз код, для реализации меню:

Меню-блок, состоит как бы из кнопок.

кнопка: наводим курсор - меняеться, уводим - принимает первоначальный вид.

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

Соре если криво обьяснил.. :unsure:

Ссылка на сообщение
Поделиться на других сайтах

Нет, ненарисованы...

ну вот например наподобие такого хочеться:

testwi3.gif

в выделеном состоянии пункт "статистика"

Хочеться узнать как такое реализовываеться..

Ссылка на сообщение
Поделиться на других сайтах

Если псевдокнопка, т.е. линк на фоне - в стилях пишешь a:hover и там другой цвет, фон и т.п.

Ссылка на сообщение
Поделиться на других сайтах

Да, думаю это то что мне нужно, только вот с css я не дружу..

Пытаюсь добавить такое:

.menu { color: #000000; font-family: tahoma; font-size: 11px; background: url(../images/menu_bg.gif); cursor: pointer; padding-left: 15px; }

.menu a:hover { color: #000000; font-family: tahoma; font-size: 11px; background: url(../images/menu_bg_actived.gif); cursor: pointer; padding-left: 20px; }

Но вообще не то че-то..

Ссылка на сообщение
Поделиться на других сайтах

Вот это - "url(../images/menu_bg_actived.gif);" - явно работать будет не всегда.

Ссылка на сообщение
Поделиться на других сайтах

Пример

HTML код

<div class="yoMenu">
<ul>
<li><a href="http://yoSite.ru" title="yoTitle">yoMenu 1</a></li>
<li><a href="http://yoSite.ru" title="yoTitle">yoMenu 2</a></li>
<li><a href="http://yoSite.ru" title="yoTitle">yoMenu 3</a></li>
</ul>
</div>[/html]

CSS

[code].yoMenu ul { list-style: none; margin: 0px 0px 5px 0px; padding: 0px; } .yoMenu ul li { display: inline; padding: 0px; margin: 0px; } .yoMenu ul li a, .yoMenu ul li a:visited { display: block; color: #5e66b1; text-decoration: none; margin: 0px; padding: 4px 10px 4px 10px; border-bottom:1px solid #f5f5f5; font-size: 10pt; background: #000 url(http://yoSite.ru/img/menuoff.gif) center center repeat-x; } .yoMenu ul li a:hover { background: #fff url(http://yoSite.ru/img/menuon.gif) center center repeat-x; color: #000; text-decoration:none; }[/code]

menuoff.gif и menuon.gif картинки высотой как пункт меню (можно больше) и шириной 2-5 пикселей.

Ссылка на сообщение
Поделиться на других сайтах

Архивировано

Эта тема находится в архиве и закрыта для публикации сообщений.

×
×
  • Создать...