Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Создание меню, Клик по всей ячейке 
:(
    Опции темы
_Developer_
Дата 22.2.2008, 08:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 31
Регистрация: 13.4.2007

Репутация: нет
Всего: 1



Есть меню следующего вида:
user posted image
Мой код:
Код

<table class="menu">
            <tr align="center">
                <td><a class="menuRef" href="" ><span class="menuItem">Hardware</span></a></td>
                    <td class="menuDivider" />
                <td><a class="menuRef" href="" ><span class="menuItem">Software</span></a></td>


Код

table.menu{
height : 38px;
width  : 100%;
background-image : url(../img/menu.jpg);
}

td.menuDivider{
 width : 4px;
 background-image : url(../img/menuDivider.jpg);
}
and so on

Все нормально, только указатель меняется на лапу(указатель ссылки), только при непосредственном наведении на надпись(что вообщем естественно).
Как сделать так, чтобы вся ячейка была ссылкой, т.е. при щелчке на любое место ячейки, осуществлялся переход по указанной ссылке.


PM MAIL   Вверх
Itsys
Дата 22.2.2008, 08:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Завсегдатай
Сообщений: 1338
Регистрация: 21.1.2008
Где: г. Москва

Репутация: 9
Всего: 34



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

По моему проще повесить обработчик onClick на ячейку - работать будет, но на лапу меняться не будет (так даже приконее - получается, что это не ссылка а кнопка.
PM MAIL WWW Skype   Вверх
_Developer_
Дата 22.2.2008, 08:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 31
Регистрация: 13.4.2007

Репутация: нет
Всего: 1



Цитата(Itsys @  22.2.2008,  08:18 Найти цитируемый пост)
В этом случае надо использовать слой поверх ячейки с прозрачным изображением, растянутым на всю ячейку, которое и будет ссылкой.

А можно пример, а то я не совсем понял?
PM MAIL   Вверх
NDenis
Дата 22.2.2008, 09:52 (ссылка) |    (голосов:1) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 317
Регистрация: 14.12.2007

Репутация: 8
Всего: 8



1. меню это список ссылок и никак не таблица
2. растянуть ссылку на 100% высоты ячейки => height:100%;
PM MAIL   Вверх
bars80080
Дата 22.2.2008, 10:35 (ссылка) |    (голосов:1) Загрузка ... Загрузка ... Быстрая цитата Цитата


прапор творюет
****
Награды: 1



Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315



Код

a { display: block; width: 100%; height: 100%; }

почти тоже что и NDenis

а чтобы лапу сделать в любом месте, добавь:
Код

/*тэг*/ { cursor: hand; }

PM MAIL WWW   Вверх
_Developer_
Дата 22.2.2008, 12:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



Профиль
Группа: Участник
Сообщений: 31
Регистрация: 13.4.2007

Репутация: нет
Всего: 1



Спасибо, помогло!
PM MAIL   Вверх
SelenIT
Дата 22.2.2008, 21:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


баг форума
****


Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 97
Всего: 401



bars80080, только не hand (который IE-only), а pointer (который везде, кроме вымершего IE5).


--------------------
Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.0465 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.