по хтмл ю вопросик

← →
antonn © (2006-11-30 15:20) [0]

хочу сделать красивую ссылку, с пиктограммой, с форматированным многострочным текстом (аналог TBitBtn в Дельфи), но чего то не получается...

вот код, что использовал:
<A href="ссылка"> <TABLE cellSpacing=0 width=100% cellPadding=0 border=1> <TBODY><TR> <td height=24 width=100%><IMG height=16 width=19 src="_images/тыры-пыры" border=0></TD> <td height=24 width=100%>многострочный текст</TD> </TR></TBODY></TABLE> </A>

Но ссылка не "нажимается" в IE, т.е. в строке статуса есть ссылка, но не переходит по ней (в фаерфоксе переходит, воспринимает всю таблицу как ссылку). Может есть способ, как заставить таблицу "кликаться"?
Мне нужно, чтобы вся таблица была ссылкой, т.к. в ячейках разного габарита контент, и, если делать ссылки в самих ячейках, "нажимается" только та часть ячейки, в которой есть контент... Или есть ли способ "нажимать" всю ячейку, даже если там текста полторы буквы?

← →
tesseract © (2006-11-30 15:22) [1]

javascript OnClick()

← →
antonn © (2006-11-30 15:24) [2]

tesseract © (30.11.06 15:22) [1]
не хотелось бы (ведь если ява отключена, событие не сработает?)

← →
tesseract © (2006-11-30 16:06) [3]

нет не сработает. В наше время javascript даже в links есть :-)

← →
Gero © (2006-11-30 16:10) [4]

А зачем нужно такое извращение?

← →
antonn © (2006-11-30 16:29) [5]

Gero © (30.11.06 16:10) [4]
разве сделать таблицу, попавшую в тех ссылки, "кликабельной" - извращение?
а вообще хочу

> сделать красивую ссылку, с пиктограммой, с
> форматированным многострочным текстом (аналог TBitBtn
> в Дельфи),

← →
tesseract © (2006-11-30 16:32) [6]

> antonn © (30.11.06 16:29) [5]

Картинку, как все нормальные люди нарисуй.

← →
Gero © (2006-11-30 16:42) [7]

> [5] antonn © (30.11.06 16:29)

<a style="display: block" href=".">Пиши здесь что влезет</a>

← →
antonn © (2006-11-30 16:52) [8]

Gero © (30.11.06 16:42) [7]
не "нажимается"

← →
Gero © (2006-11-30 17:00) [9]

> [8] antonn © (30.11.06 16:52)

Ссылка из [7] не нажимается? Или ты опять туда таблицу влепил?

← →
homm © (2006-11-30 17:02) [10]

> не "нажимается"

пробуй еще.

← →
antonn © (2006-11-30 17:04) [11]

Gero © (30.11.06 17:00) [9]
Или ты опять туда таблицу влепил?
а что же мне туда влепливать, если я с нулевого поста пытаюсь это сделать? :)

← →
Gero © (2006-11-30 17:08) [12]

> [11] antonn © (30.11.06 17:04)

Табоица не нужна, используй div.

<a style="display: block" href="."><div style="background-color: green">Пиши</div> здесь что влезет</a>

← →
antonn © (2006-11-30 17:10) [13]

приведу еще одну аналогию - обычный пункт всплывающено меню, "нажимается" не только там где надпись, а по всей своей площади (и может содержать иконку), причем текст пункта выровнен по вертикали. Вот примерно это я и хочу выполнить в хтмл (такие "пункты" просто списком на странице)

← →
saxon (2006-11-30 17:12) [14]

> antonn © (30.11.06 17:10) [13]

А ты в соурс не пробовал смотреть, такого меню?

← →
antonn © (2006-11-30 17:19) [15]

saxon (30.11.06 17:12) [14]
куда смотреть?

← →
saxon (2006-11-30 17:32) [16]

> antonn © (30.11.06 17:19) [15]

Поищи в интернете, подходящее тебе, и переделай под себя.

Например на сайте microsoft есть левое меню - может тебе подойдет. Там как раз ссылка работает "по всей своей площади".

← →
antonn © (2006-11-30 17:35) [17]

saxon (30.11.06 17:32) [16]
Поищи в интернете, подходящее тебе, и переделай под себя.
радикально:)

> Например на сайте microsoft есть левое меню - может
> тебе подойдет. Там как раз ссылка работает "по всей
> своей площади".

в том то и дело, что под ИЕ она не работает во всей площади...

← →
saxon (2006-11-30 17:43) [18]

> antonn © (30.11.06 17:35) [17]
> радикально:)

Достаточно распространенная практика.

> в том то и дело, что под ИЕ она не работает во всей площади. ..

Странно у меня ИЕ (7) и работает.(?)
Да и вообще как это у microsoft и под ИЕ и не работает!?

← →
MeF Dei Corvi © (2006-11-30 17:54) [19]

у меня нормально работает:
http://www.mirgames.ru/
пункты в меню - это обычные <a href="blabla">blabla</a>
вроде пока никто не жаловался

← →
Vendict © (2006-11-30 18:08) [20]

лезем на кладовку(http://kladovka.net.ru/index.cgi?pid=dir&rid=21), смотрим HTML-код странички. там есть такие "кнопочки" для скачивания.

а реализуются они так:

<a title="Скачать исходник" class="download" href="download.cgi?id=257">Скачать</a>

а в стиле (css) пишется такой кусочек:

A.download
{
font-family: Verdana, Arial Cyr;
font-size: 8pt;
font-weight: bold;
text-decoration: none;
color: #000000;
background: #DEDEDE;
border: #000000 1px solid;
padding: 5px 10px;
}
A:hover.download
{
color: #E50000;
}

← →
antonn © (2006-11-30 18:16) [21]

MeF Dei Corvi © (30.11.06 17:54) [19]
Vendict © (30.11.06 18:08) [20]
одним из обязательных элементов является битмап слева от текста, битмап задается динамически (т.е. в css его не прописать?). Сделать текстовые пункты меню, работающие по всей площади не проблема, я их уже делал, а вот сделать пункт с нескольки областями с разным форматированием проблемка:(

← →
antonn © (2006-11-30 18:17) [22]

мне вообще интересно, это вообще правильно, что таблица в тегах ссылки не является ссылкой? :)

← →
antonn © (2006-11-30 18:21) [23]

ну и вообще, по общему восприятию - нормально будет иметь в css порядка 20 одинаковых A.MenuItem* с одинаковыми св-вами, кроме BACKGROUND: url(картинка) ? :)

← →
antonn © (2006-11-30 18:22) [24]

+оффотоп
меня вообще сегодня на слово "вообще" пробивает...

← →
MeF Dei Corvi © (2006-11-30 18:23) [25]

<a href="ffdfgdf"><img src="gdfgf" width="50" />Text</a>

style:
a {
padding: 3px;
font: 12pt Tahoma;
clear: left;
background: #000;
color: #fff;
}

a img {
float: left;
}

неужто не заработает?

ты хочешь что-то вроде этого: http://www.mirgames.ru/mef/favr/index.html ?

← →
MeF Dei Corvi © (2006-11-30 18:24) [26]

> что таблица в тегах ссылки не является ссылкой? :)

С точки зрения спецификации правильно :)

← →
Bizon (2006-11-30 18:27) [27]

Попробуй теги таблицы сделать внешними, а в ссылку включать теги строки таблицы.

← →
Vendict © (2006-11-30 18:39) [28]

antonn © (30.11.06 18:21) [23]
ну и вообще, по общему восприятию - нормально будет иметь в css порядка 20 одинаковых A.MenuItem* с одинаковыми св-вами, кроме BACKGROUND: url(картинка) ? :)

а если попробовать в <a> вставлять и картинку и разделять её с текстом неразрывними пробелами ?
<a title="Скачать исходник" class="download" href="download.cgi?id=257"><img src="image.jpg"> Скачать</a>
оставив тот css который я приводил.

MeF Dei Corvi © (30.11.06 18:23) [25]
ты хочешь что-то вроде этого: http://www.mirgames.ru/mef/favr/index.html ?
да, вроде этого:) спасибо, перелопачу под себя:) вот это a img { float: left} я не знал (в моем куцом справочнике про такое нет, и из-за этой штуки я и полез в таблицы:)). Спасибище огромное:)

Bizon (30.11.06 18:27) [27]
там отступы получаются

Vendict © (30.11.06 18:39) [28]
а если будет <break> ? он перенесется под картинку

> в моем куцом справочнике

спецификация - лучший справочник :)

> [13] antonn © (30.11.06 17:10)
> приведу еще одну аналогию - обычный пункт всплывающено меню,
> "нажимается" не только там где надпись, а по всей своей
> площади

Я же тебе об этом и написал. display: block.

Gero © (30.11.06 19:56) [33]
возможно я не так что то делал...

<a style="display: block" href="."> <div style="background-color: green"><IMG height=48 width=48 src="пикча" border=0></div>text<br>text </a>
- текст находится под картинкой

<a style="display: block" href="."> <div style="background-color: green"><IMG height=48 width=48 src="пикча" border=0>text<br>text</div> </a>
- текст находится под картинкой

<a style="display: block" href="."> <div style="background-color: green"><IMG height=48 width=48 src="пикча" border=0></div> <div style="background-color: green">text<br>text</div> </a>
- текст находится под картинкой

← →
saxon (2006-11-30 20:52) [35]

вот еще пример

<ul><a href="."><div><img src="" align="left" border=0>1 line<br>2 line</div></a></ul>

с расположением img можно эксперементировать.

> <ul><a href="."><div><img src="" align="left" border=0>1
> line<br>2 line</div></a></ul>

а нафига ul??(это ж даже валидатор не пропустит) и div...
проще надо быть))

← →
saxon (2006-11-30 21:07) [37]

> MeF Dei Corvi © (30.11.06 21:00) [36]

Да я же не сам придумывал. Вырезал и подчистил, может чего и лишнего. Вкинул в файлик - смотрю в моем ИЕ7 работает, - как пример сойдет. ;)
А вот без дива, кстати эффект не тот.

MeF Dei Corvi © (30.11.06 21:00) [36]
кстати, как на твоих меню сделать вертикальное выравнивание по центру? :)
например, я взял картинку 16*16 и хочу ее видеть по центру, у меня совсем не получается:(
для просто скачал http://www.mirgames.ru/mef/favr/index.html и правлю на ней - картинка ужимается, но не хочет быть по центру

ну там косячки есть))
1) vertical-align: center; - там не center, там должно быть middle. Но не суть важно, т.к. там оно вообще никчему)
2) вертикальное позиционирование устанавливается читерским способом))) с помощью padding-top и padding-bottom))
#colsearch a b { display: block; margin-left: 100px; padding: 5px; padding-top: 31px; padding-bottom: 30px; font-weight: normal; }

p.s. если кто знает нечитерский способ вертикального центрирования, поделитесь))

MeF Dei Corvi © (30.11.06 21:18) [39]
p.s. если кто знает нечитерский способ вертикального центрирования, поделитесь))
и со мной тоже:) я вот на этом и застрял, в таблице все замечательно центрируется с помощью valign, но вот же неприятность, таблица не хочет "ссылаться":)

по хтмл ю вопросик Найти похожие ветки