Google-Translate Войти на сайт
 
МЕНЮ САЙТА
РАЗДЕЛЫ
Уроки Ucoz [13]
Уроки Borda.ru [13]
Уроки Photoshop [32]
Уроки Adobe Illustrator [1]
Уроки HTML и CSS [13]
JAVA-Скрипты [15]
Веб-дизайн [17]
Создание и продвижение сайта [92]
Интересные статьи [279]
ВЕЛОЛЮБИТЕЛЯМ!
Ярмарка Мастеров - ручная работа, handmade
КОНТАКТЫ
ICQ: 177700574
skype: k-dezign
mail: k-dezign@mail.ru
Мы Вконтакте
НАШИ ДРУЗЬЯ
Быстрая и недорогая раскрутка сайта
Регистрация в каталогах
Сибирский рубеж - автоэмали оптом и в розницу. Подбор автоэмалей PROFIX.
Хорошие новости о животных
WOlist.ru - каталог качественных сайтов Рунета
FONWEB.RU - Веб-дизайн
Интересные статьи
Клипарт на прозрачной основе


ЗАРЕГИСТРИРОВАТЬ СВОЙ САЙТ
СТАТИСТИКА
Онлайн всего: 1
Гостей: 1
Пользователей: 0
Главная | Полезные статьи
Главная » Статьи » Уроки Borda.ru

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

итак, все что нам понадобится - это узнать положение фрагмента картинки относительно ее начала. 
Сделать это можно в Paint - ставится автоматически на каждом компьютере. 

Открываем картинку, подносим курсор к верхнему левому углу (выделен красным) и видим внизу 2 цифры, например, 205, 3 - это координаты точки х1 и у1. Записываем их. Теперь подносим курсор к нижнему правому углу (выделен красным) и проделываем ту же операцию (получаем х2, у2). 
То же самое проделываем с каждым пунктом нашей будущей навигации.

Теперь можно создавать карту ссылок:

<img src="адрес_каринки" usemap="#Map"> 
<map name="Map"> 
<area shape="rect" coords="х11,у11,х21,у21" href="ссылка1"> 
<area shape="rect" coords="х12,у12х22,у22" href="ссылка2"> 
</map> 

строку <area можно вставить одну под другой столько раз, сколько у вас ссылок на данном изображении для данной карты ссылок (в примере -для двух ссылок 11, это для первой, а 12- для второй)

Кроме этого, область ссылк можно сделать не прямоугольной, а круглой, если в логотипе присутствует что-нибудь типа круглой кнопки: 


Для этого нам необходимо получить координаты центра круга и размер радиуса (как сделать- смотри выше). 
в итоге получаем: 

<img src="адрес_картинки" usemap="#Map" /> 
<map name="Map" id="Map"><area shape="circle" coords="[font color=red]х,у,R[/font]" href="с[font color=red]сылка[/font]" /></map>

х,у- координаты центра окружности 
R - радиус окружности, 
например : 

<img src="адрес_картинки" usemap="#Map" /> 
<map name="Map" id="Map"><area shape="circle" coords="37,37,35" href="ссылка" /></map>

таким образом при наведении на уголок квадрата, в который вписана окружность, ссылки не будет, а внутри окружности - будет
Категория: Уроки Borda.ru | Добавил: Белая_Кошка (17.08.2011)
Просмотров: 3394 | Рейтинг: 0.0/0


Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Веб-студия "К-Дизайн" © 2009-2024
Контакты
ICQ: 177700574
skype: k-dezign
mail-агент: k-dezign@mail.ru

Счетчики
Яндекс цитирования
Работа
Создание сайтов и форумов
Порядок работы с заказами
Порядок оплаты заказов
Бонусы
Бесплатные кнопки для форумов
Бесплатные дизайны для форумов
Готовые шаблоны для сайтов
Уроки фотошоп
Уроки CMS Ucoz