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

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Задать кликабельную область ссылки 
:(
    Опции темы
Limonadni Joe
Дата 21.7.2006, 11:44 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 311
Регистрация: 1.11.2002
Где: Москва

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



Как задать ширину и высоту кликабельной области ссылки? Внутри ссылки - картинка. 
PM MAIL ICQ YIM MSN   Вверх
skyboy
Дата 21.7.2006, 11:52 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


неОпытный
****


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

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



Limonadni Joe, в пределах картинки или за пределами? Если в пределах, то карты тебе в помощь, если за пределами - то сделай ссылку на слое. Типа такого:
Код

<a href="http://www.google.com"><div style="width:100px; height: 100px; background-color:'#0F0'">aaa</div></a>


Добавлено @ 11:53 
вместо "ааа" - твоя картинка... 
PM MAIL   Вверх
katka
Дата 21.7.2006, 12:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


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

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



skyboy, какой-то это плохой выход.. вы каким браузером этот код смотрели? или не смотрели совсем? 
--------------------
если с другом буду я, если с другом буду я, а медведь — без друга
PM MAIL WWW ICQ   Вверх
R.M.
Дата 21.7.2006, 13:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Анархист
****


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

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



skyboy, ну низя так делать, читай спецификацию. Глянь что на это валидатор тебе скажет, это тоже самое что в span засунуть table smile  


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

Nokia LifeStyle - Всё для смартфонов Nokia 
PM MAIL WWW ICQ   Вверх
k206i
Дата 21.7.2006, 14:13 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Новичок



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

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



Limonadni Joe, к сожалению, так нельзя. Если тока "map" создавать внутри картинки... 
PM MAIL WWW ICQ   Вверх
skyboy
Дата 21.7.2006, 15:22 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


неОпытный
****


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

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



katka, IE 6.0.2900...., Opera 8.54, FireFox 1.5.0.4... Если дадите пару дней, нарою дома lynx, и попробую в нём.  smile  А в чём дело, собственно? Как Вы смотрели - с текстом или картинкой внутри? Все три указанные броузера отображают и переходят по ссылке  в обоих случаях. 
Куксикус, ты про картинку внутри слоя, про слой внутри ссылки, про текст внутри слоя, про аттрибут Style или про задание цвета трёмя цифрами вместо 6? Если про аттрибут стиля вместо указания класса - так это для наглядности, чтоб в одной строке всё уместилось.  И, если не сложно, дай ссылку именно на те стандарты, которые я нарушил. 
Впрочем, код мне самому не нравится. Но если писать в onclick обработчик, то переход будет работать только при включенной javascript. 
А автор так и не уточнил, что он имел в виду. Ведь если надо, чтоб картинка была кликабельна за пределами, то можно сделать её больше, а "добавленное" пространство сделать прозрачным...
 
PM MAIL   Вверх
Limonadni Joe
Дата 21.7.2006, 15:29 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 311
Регистрация: 1.11.2002
Где: Москва

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



Цитата(skyboy @  21.7.2006,  15:22 Найти цитируемый пост)
А автор так и не уточнил, что он имел в виду. Ведь если надо, чтоб картинка была кликабельна за пределами, то можно сделать её больше, а "добавленное" пространство сделать прозрачным...

Да, мне именно это и нужно. Правда, редактирование картинки мне не подходит: уж больно много их. То, что вы предложили меня вполне устраивает. Только одна мелочь осталась - у меня почему-то курсор не меняется на руку. Это можно как-то поправить, не прописывая жестко cursor: pointer?
 
PM MAIL ICQ YIM MSN   Вверх
katka
Дата 21.7.2006, 15:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


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

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



skyboy, уважаемый.
во-первых, если говорить о браузерах: в FF ссылка расползлась до правой части экрана. в ИЕ её вообще не увидишь, пока не поставишь cursor: pointer.
если о css — давно ли у нас пишут цвета в кавычках?

теперь о стандартах. как вы думаете, блочный элемент можем мы запихивать внутрь текстового? 
--------------------
если с другом буду я, если с другом буду я, а медведь — без друга
PM MAIL WWW ICQ   Вверх
deMike
Дата 21.7.2006, 17:57 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


M.Shinoda
**


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

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



Limonadni Joe, используйте map's и будет вам счастье. 
PM MAIL WWW   Вверх
12345c
Дата 22.7.2006, 00:00 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

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



Код
<b>Ссылка с невидимой областью клика</b>:<br><br><br>
<style>
.d{position:relative;left:20px;top:-1em;}
.e{cursor:hand;cursor:pointer;position:absolute;width:70px; height:50px;border:1px dashed;}
</style>
<script>
ff=function(t){
  location=t.parentNode.parentNode.childNodes[1].href;
}</script>
abc <span class=s><span class=d><span class=e onclick=ff(this)></span></span><a href="http://www.google.com">aaa</a></span><br>
bba bbc <span class=s><span class=d><span class=e onclick=ff(this)></span></span><a href="http://www.ya.ru">baa</a></span><br>
Это соответствует задаче. Опера, правда, странно с полями себя ведёт, так что надо доделывать.

Вы заходите с таким задачками на форум "Javascript" ... "и будет вам счастье". 


--------------------
Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go
PM WWW   Вверх
skyboy
Дата 22.7.2006, 00:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


неОпытный
****


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

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



Цитата(katka @  21.7.2006,  15:36 Найти цитируемый пост)
в FF ссылка расползлась до правой части экрана

не заметил. Спасибо за инфо.
Цитата(katka @  21.7.2006,  15:36 Найти цитируемый пост)
если о css — давно ли у нас пишут цвета в кавычках?

каюсь и посыпаю голову пеплом. Конечно же, у вас - не пишут цвета в кавычках smile
Цитата(katka @  21.7.2006,  15:36 Найти цитируемый пост)
теперь о стандартах. как вы думаете, блочный 
элемент можем мы запихивать внутрь текстового? 

А какая разница? Ну, принципиально? Что это дурной тон, можете не говорить. объясните, пожалуйста, чем же НЕправильно?  
PM MAIL   Вверх
R.M.
Дата 23.7.2006, 00:47 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Анархист
****


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

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



skyboy, я про то что тебе уже сказала katka - нельзя пихать блочный элемент внутрь текстового.

Цитата(skyboy @  22.7.2006,  01:36 Найти цитируемый пост)
А какая разница? Ну, принципиально? Что это дурной тон, можете не говорить.  

Хм... я умываю руки, если тебе "работает а как сделано неважно" то тут я не помошник, надо делать правильно.

Цитата(skyboy @  22.7.2006,  01:36 Найти цитируемый пост)
объясните, пожалуйста, чем же НЕправильно?  

Неправильно тем что это не по стандарту. 

Цитата(skyboy @  21.7.2006,  16:22 Найти цитируемый пост)
И, если не сложно, дай ссылку именно на те стандарты, которые я нарушил. 

Не трудно. The W3C Markup Validation Service 


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

Nokia LifeStyle - Всё для смартфонов Nokia 
PM MAIL WWW ICQ   Вверх
skyboy
Дата 24.7.2006, 14:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


неОпытный
****


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

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



Цитата(Куксикус @  23.7.2006,  00:47 Найти цитируемый пост)
Не трудно. The W3C Markup Validation Service 

Спасибо.
Цитата(Куксикус @  23.7.2006,  00:47 Найти цитируемый пост)
если тебе "работает а как сделано неважно"

Только не надо за меня говорить, ладно? И додумывать тоже ничего не надо.  smile 
К слову, img - это текстовый элемент? Ну, раз конструкция <a ...><img ... /></a> valid'на, значит - инлайн. Я-то думал - блочный... 
PM MAIL   Вверх
katka
Дата 24.7.2006, 14:38 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


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

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



skyboy, img, кажется, вообще inline-block. не рыба не мясо, то есть ) 
--------------------
если с другом буду я, если с другом буду я, а медведь — без друга
PM MAIL WWW ICQ   Вверх
skyboy
Дата 24.7.2006, 15:08 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


неОпытный
****


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

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



katka, да. похоже на то. и <a ...><img .../></a> - валидная конструкция, и <span><img ... /></span> 
Ну и ну smile 
PM MAIL   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




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


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

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