Помогите с меню

FORUMS

MEMBERS

RECENT POSTS

УСТРАНЕНИЕ КОНКУРЕНТОВ. БЛОКИРОВКА ДОМЕНОВ, БЛОКИРОВКА ИНСТАГРАМ/ТЕЛЕГРАМ И ДРУГОЕ. ПРОВЕРЕННЫЙ СЕЛЛЕР.

НОВЫЕ ТОРГОВАЯ НОВОСТИ ЧАТ

Скрыть

		ANTICHAT > ПРОГРАММИРОВАНИЕ > PHP
Помогите с меню

Опции темы

Поиск в этой теме

Опции просмотра

Помогите с меню

16.01.2008, 16:46

Nicca

Познающий

Регистрация: 11.01.2008

Сообщений: 98

С нами: 9648910

Репутация: 4

Помогите с меню

Подскажите пожалуйста как сделать ефект с меню такой как на http://www.avito.ru/ (на сайте слева)
Я смотрел сорс ихний но что-то не могу понять как ефект синей полоски получается на всю длинну (у меня только заполняется синим текст)

𝕏 Twitter Reddit Telegram Копировать ссылку

16.01.2008, 17:02

groundhog

Познавший АНТИЧАТ

Регистрация: 12.05.2007

Сообщений: 1,235

С нами: 9999746

Репутация: 1318

Достаточно засунуть элементы меню в SPAN или DIV и уже к ним применить JS-код, который будет заменять в элементе *.style.bgColor при событии onmouseover/onmouseout.

16.01.2008, 17:07

D0S

Познающий

Регистрация: 06.01.2007

Сообщений: 44

С нами: 10180537

Репутация: 32

Цитата:

Сообщение от groundhog

+1

Например:

PHP код:


		
			
<table width="100" border="0" align="center" cellpadding="2" cellspacing="1" style="border:1px solid #666666;">

<tr>     

<td align="center" bgcolor="#001E32" onmouseover="this.style.backgroundColor='#FFFFFF';" onmouseout="this.style.backgroundColor='#001E32'"><a href="/">HOME</a></td>

</tr>

</table>

А как у них если то:
CSS:

PHP код:


		
			
/* Categories */

.Cats { width:190px; }

.Cats th    { text-align:left; color:#000000; padding:20 0 10 20; font-size:11px; font-weight:bold; background-color:#f8f8f8;}

.Cats td    { line-height:27px; padding: 0 10 0 10; background-color:#f8f8f8;}

.Cats img#cimg { vertical-align:middle; margin:10 10 10 3; }

.Cats div#box { background-color:#ffffff; border:#f1f1f1 solid 1px; margin:10 0; }

.Cats td#addon    { width:180px; border:#f1f1f1 solid 1px; padding: 5 5 5 5; background-color:#ffffff; margin-top:15px; }

.Cats a    { float:left; color:#555555; border-top:#f5f5f5 solid 1px; padding-left:10px; font-size:11px; text-decoration:none; width:180px;}

.Cats a:hover { color:#ffffff; background-color:#81b4e9; text-decoration:none;}

.Cats a#ad    { float:left; color:#81b4e9; border:0; padding-left:10px; font-size:11px; text-decoration:none; width:100%; }

.Cats a#ad:hover { color:#ffffff; background-color:#81b4e9; text-decoration:none;}

.Cats td#info { color:#777777; font-size:9px; padding:10 10 0 20; }

Последний раз редактировалось D0S; 16.01.2008 в 17:15..

16.01.2008, 17:05

sedoy_xxx

Участник форума

Регистрация: 05.07.2006

Сообщений: 285

С нами: 10447586

Репутация: 117

Код:

...id=mmenu0 onmouseover="mmenu_over(0)" onMouseOut="mmenu_out(0)...

Код:

...id=mmenu1 onmouseover="mmenu_over(1)" onMouseOut="mmenu_out(1)...

Вот эти куски частично отвечают за этот Эффект. А вообще поищи прогу которая называется типа menumaker, как раз предназначена для создания меню.

16.01.2008, 17:36

Isis

Флудер

Регистрация: 20.11.2006

Сообщений: 3,315

С нами: 10248806

Репутация: 2371

Мда..а легче одним выражением в CSS

PHP код:


		
			
tr:hover

{

    background-color: blue;

}

16.01.2008, 17:37

FeraS

Постоянный

Регистрация: 20.01.2007

Сообщений: 705

С нами: 10161726

Репутация: 1329

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
</head>

<style>
body{font-family: Tahoma; font-size: 12px;}
.tbl{background: #F8F8F8; width: 220px; text-align: center;}
.tbl td{padding: 10px;}
.tbl a{color: #555555; text-decoration: none;}
.tbl a:hover{color: #FFFFFF; text-decoration: none; background: #81B4E9; padding-top: 5px; padding-bottom: 5px; padding-left: 35px; padding-right: 35px;}
</style>

<body>

<table border="0" cellspacing="0" cellpadding="0" class="tbl">
  <tr>
    <td><a href="#">Пункт 1</a></td>
  </tr>
  <tr>
    <td><a href="#">Пункт 2</a></td>
  </tr>
  <tr>
    <td><a href="#">Пункт 3</a></td>
  </tr>
</table>


</body>
</html>

Почти тоже самое

, только с паддингами поиграть нада и еще чет вроде)

Последний раз редактировалось FeraS; 16.01.2008 в 18:02..

16.01.2008, 18:38

groundhog

Познавший АНТИЧАТ

Регистрация: 12.05.2007

Сообщений: 1,235

С нами: 9999746

Репутация: 1318

Isis, твой способ подействует на всю строку... А нужно по границе слова... Или тогда в каждой ячейке создавать по таблице из одной строки, чтобы он не отбивал по ширине самой длинной колонки...

16.01.2008, 20:11

Nicca

Познающий

Регистрация: 11.01.2008

Сообщений: 98

С нами: 9648910

Репутация: 4

Спасибо.
А интересно можно стилями сделать у синего слоя левую и правую гоаницу заокругленными

16.01.2008, 20:25

groundhog

Познавший АНТИЧАТ

Регистрация: 12.05.2007

Сообщений: 1,235

С нами: 9999746

Репутация: 1318

Nicca, чисто стилями - нет. Но CSS + JPG и не такую красоту творили...

#10

16.01.2008, 20:51

astrologer

Постоянный

Регистрация: 30.08.2007

Сообщений: 773

С нами: 9840758

Репутация: 808

Цитата:

Сообщение от groundhog

Nicca, чисто стилями - нет. Но CSS + JPG и не такую красоту творили...

http://www.html.it/articoli/nifty/index.html

« Предыдущая тема | Следующая тема »

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
как взломать домофон	ReZiDeNT	"Железо"	5	11.01.2008 17:03
Помогите с вышкой.	PomaH9991	Болталка	27	16.12.2007 23:13

Здесь присутствуют: 1 (пользователей: 0 , гостей: 1)

Быстрый переход

Home

Help

Terms and Rules