Проблема при создании графической карты ссылок

[IAEA]

Добрый день уважаемые веб-мастера. Нуждаюсь в Вашем совете.



Имеется собственный сайт, CMS - ucoz. Прикреплен собственный домен.



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



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



В коде CSS я нашел блок, который отвечает за параметры картинки, которая используется в качестве фона на сайте:





Код:

Код: Выделить всё

#background-top {
	min-height: 1235px;
	min-width: 927px;
	width: 100%;
	background: url('images/background-top.jpg') no-repeat center top;

Возникает вопрос: как в данные параметры поместить теги для карты ссылок и можно ли такое сделать вообще. Код для карты ссылок я уже составил, он выглядит следующим образом:





Код:

Код: Выделить всё

<MAP NAME="LOGO">
<AREA SHAPE="RECT" COORDS="217,38,506,93" HREF="http://www.name-site.ru/">
</MAP>
<IMG SRC="/images/background-top.jpg" USEMAP="#LOGO">

Перепробовал разные варианты - ничего не помогает, может быть кто посоветует.

[Sham]

Определите width и height для img. Непонятно, зачем стили тогда...

[Sham]

хорошо попробую объяснить по другому.



вот адрес

сайта

(не реклама, а в качестве живого примера страницы).

А вот изображение которое является фоном и для которого нужно сделать карту ссылок. Вот скрин

Изображение которое используется для фона

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

область изображения на которую нужно сделать ссылку

[Sham]

map возможен только для тега img (даже не для самой картинки). Т.е. определите ширину и высоту тега (width и height), в которую должны уместиться координаты area. Для фоновой картинки этот вариант не годится.

Для фона имхо сгодится прозрачный элемент с position:absolute (например div) и координатами. Но тогда и фон дб абсолютно расположен...

[IAEA]

Sham, спасибо за советы. случайно набрел на один зарубежный

сайт

, по исходному коду в Google Chrome можно понять что ситуация аналогичная моей, только там все уже реализовано.



ссылка на навигационную панель и на логотип сайта, который перенаправляет посетителей на главную страницу сайта, реализованы через div блоки,





Код:

Код: Выделить всё

<div id="logo">
<a href="../index.html"><h1><strong>IconMoon</strong> - Online Portfolio of JJ.Ying</h1></a>
</div>

параметры которых прописаны в css.





Код:

Код: Выделить всё

#header{
    width:950px;
    height:115px;
    display:block;
    position:relative;
}
#logo{
    position:absolute;
    left:74px;
    top:0;
    display:block;
    width:333px;
    height:98px;
    overflow:hidden;
}
#logo a{
    display:block;
    width:333px;
    height:98px;
}
#logo a:hover{
    background:url('images/main.png') no-repeat;
}

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

[rsod]

http://scr.rsod.org/scr_2011-02-20_19-00-01.png

жуть. Мой вам совет, валите с юкоза. p.s. windows xp уже постепенно умирает p.p.s. не забудьте создать на сайте статьи "Избавляемся от тормозов в Windows XP" и "Как вернуь Windows в рабочее состояние."