Как задать активную область ссылки на картинке?

E1
На сайте с 05.09.2010
Offline
122
5495

На одном сайте видел, где через css было реализовано подобная штука, но не могу найти этот сайт чтоб повнимательнее вникнуть как было сделано.

Там иконки социальных сетей в одной картинке, в ряд, но если навести, у каждой области свой линк был. Тут http://htmlbook.ru/html/a глянул, coords и shape вроди то что надо, но IE их не поддерживает...

И не через area вроди было реализовано там.

Пытался указать класс

<a class="rss" href="feed"></a>

И в css сделать

#rss {width: 20px;height: 20px;}

Но что-то не прокатило..

Помогите пожалуйста.

converse19880604
На сайте с 31.05.2009
Offline
164
#1
E1
На сайте с 05.09.2010
Offline
122
#2

А через css не получится задать координаты?

T
На сайте с 20.03.2007
Offline
67
Toy
#3
End1:
Там иконки социальных сетей в одной картинке, в ряд, но если навести, у каждой области свой линк был.

Ставьте сколько нужно линков, просто ту самую картинку используйте в качестве background, просто с различными параметрами background-position. Держу пари, там где вы это видели, так и сделано. Также делают, например, в Facebook (сохраните бекграунд у логотипа).

arkadiy_a
На сайте с 11.06.2008
Offline
82
#4
End1:
Но что-то не прокатило..

Только не забывайте - ссылки на соцсети лучше (в конечном итоге) джаваскриптом выводить, если не хотите, чтоб ссылочное "растеклось" куда не надо :) На крайний случай - noindex+nofollow.

E
На сайте с 03.12.2010
Offline
140
#5

если есть одна картинка (лучше в качестве бекграунда блока) и надо раскидать по ней разные ссылки, можно всунуть несколько <a href с абсолютным позиционированием, поставить display:block ну и нужную ширину-высоту. я обычно так делаю.

E1
На сайте с 05.09.2010
Offline
122
#6

Примного благодарен господа, сделал через бекграунд, всё прокатило, знал бы как тут репу поднять, всем бы отплюсовал :)

E
На сайте с 03.12.2010
Offline
140
#7

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

M1
На сайте с 09.12.2010
Offline
4
#8

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

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий