Имя пользователя:
Пароль:  
Помощь | Регистрация | Забыли пароль?  | Правила  

Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » Проблема при создании графической карты ссылок

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

Аватара для IAEA

Новый участник


Сообщения: 47
Благодарности: 3

Профиль | Отправить PM | Цитировать


Изменения
Автор: IAEA
Дата: 18-02-2011
Добрый день уважаемые веб-мастера. Нуждаюсь в Вашем совете.

Имеется собственный сайт, 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">
Перепробовал разные варианты - ничего не помогает, может быть кто посоветует.

Отправлено: 08:41, 18-02-2011

 

Deadooshka


Сообщения: 2538
Благодарности: 696

Профиль | Отправить PM | Цитировать


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

Отправлено: 20:32, 18-02-2011 | #2



Для отключения данного рекламного блока вам необходимо зарегистрироваться или войти с учетной записью социальной сети.

Если же вы забыли свой пароль на форуме, то воспользуйтесь данной ссылкой для восстановления пароля.


Аватара для IAEA

Новый участник


Сообщения: 47
Благодарности: 3

Профиль | Отправить PM | Цитировать


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

вот адрес сайта (не реклама, а в качестве живого примера страницы).
А вот изображение которое является фоном и для которого нужно сделать карту ссылок. Вот скрин



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


Отправлено: 09:15, 19-02-2011 | #3


Deadooshka


Сообщения: 2538
Благодарности: 696

Профиль | Отправить PM | Цитировать


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

Отправлено: 21:51, 19-02-2011 | #4


Аватара для IAEA

Новый участник


Сообщения: 47
Благодарности: 3

Профиль | Отправить PM | Цитировать


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;
}
На днях, хочу более подробно разобраться с этим кодом и по аналогии реализовать точно такой же у себя на сайте. глядишь может и получится.

Отправлено: 18:14, 20-02-2011 | #5


Аватара для rsod

Ветеран


Сообщения: 1344
Благодарности: 154

Профиль | Отправить PM | Цитировать


http://scr.rsod.org/scr_2011-02-20_19-00-01.png
жуть. Мой вам совет, валите с юкоза. p.s. windows xp уже постепенно умирает p.p.s. не забудьте создать на сайте статьи "Избавляемся от тормозов в Windows XP" и "Как вернуь Windows в рабочее состояние."

-------


Последний раз редактировалось rsod, 20-02-2011 в 19:06.


Отправлено: 19:00, 20-02-2011 | #6



Компьютерный форум OSzone.net » Компьютеры + Интернет » Вебмастеру » Проблема при создании графической карты ссылок

Участник сейчас на форуме Участник сейчас на форуме Участник вне форума Участник вне форума Автор темы Автор темы Шапка темы Сообщение прикреплено

Похожие темы
Название темы Автор Информация о форуме Ответов Последнее сообщение
Проблема при создании админ точки SolidWorks 2011 Pozia Автоматическая установка приложений 0 05-02-2011 16:32
VBA - [решено] проблема при создании сервиса SharkyUA Программирование и базы данных 1 29-12-2010 10:47
RAID - [решено] Проблема при создании RAID5 аппаратными средствами Farxat Накопители (SSD, HDD, USB Flash) 0 23-08-2010 11:54
Установка - [решено] Проблема при создании точки восстановления iva55 Microsoft Windows Vista 49 04-03-2010 01:03
2008 - [решено] Проблема с ГП в AD., проблема при создании ГП к отдельным OU kozemit Windows Server 2008/2008 R2 2 15-07-2009 10:52




 
Переход