<MyRusakov.ru />

Финансовая грамотность от А до Я

Финансовая грамотность от А до Я

Данный курс в кратчайшие сроки обучит Вас финансовой грамотности. Эти знания позволят Вам получить, как минимум, серьёзную финансовую стабильность, а, как максимум, финансовую независимость.

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

Помимо самого курса Вас ждёт ещё бесплатный ценный Бонус: «Ранний выход на пенсию». В рамках этого Бонуса Вы узнаете, какой должен быть капитал конкретно в Вашем случае, варианты его получения, а также какие есть стратегии вывода капитала на пенсии и где их можно протестировать.

Подробнее
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Какая тема Вас интересует больше?

Форум сайта MyRusakov.ru

как сделать круглую ссылку круглой
28.05.2013 19:08:11 как сделать круглую ссылку круглой Сообщение #1
andrey-k

andrey-k

Новичок

Новичок

Дата регистрации:
28.05.2013 18:57:31

Сообщений: 4

Доброго времени суток. Помогите решить проблему. Имеем круглую картинку, которая должна быть ссылкой. необходимо сделать так, чтоб картинка вела себя как круглая, т.е. переход по ссылке и ховер срабатывали только при наведении на видимую круглую часть картинки. Особенность в том, что макет резина и картинка соответственно резина. Помогите пожалуйста.Спасибо.
Профиль
28.05.2013 19:32:49 как сделать круглую ссылку круглой Сообщение #2
ilyadenisovid

ilyadenisovid

Мастер

Мастер

Дата регистрации:
28.01.2013 18:32:29

Сообщений: 213


<img src = "image.jpg" usemap = "#nameMap" />
<map name = "nameMap">
<area href = "ваша ссылка" shape = "circle" coords = "x, y, r" />
</map>
x - координата Х центра окружности
y - координата У центра окружности
r - радиус окружности
Профиль
28.05.2013 19:45:11 как сделать круглую ссылку круглой Сообщение #3
andrey-k

andrey-k

Новичок

Новичок

Дата регистрации:
28.05.2013 18:57:31

Сообщений: 4

картинка резина. при изменении разрешения координаты не совпадут с картинкой, так как картинка увеличится
Профиль
28.05.2013 21:14:40 как сделать круглую ссылку круглой Сообщение #4
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

Только с помощью CSS3 и свойства border-radius.
Профиль
28.05.2013 21:33:03 как сделать круглую ссылку круглой Сообщение #5
andrey-k

andrey-k

Новичок

Новичок

Дата регистрации:
28.05.2013 18:57:31

Сообщений: 4

с помощью css3 border-radius стили действительно работают как на круглой картинке, но курсор ведет себя как на квадратной ссылке т.е. реагирует на углы картинки
Профиль
28.05.2013 21:56:24 как сделать круглую ссылку круглой Сообщение #6
Admin

Admin

Администратор

Администратор

Дата регистрации:
27.05.2010 21:23:42

Сообщений: 3063

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Круглые изображения</title>
<style>
.round {
border-radius: 100px;
border: 3px solid green;
}
.round:hover {
cursor: pointer;
}
</style>
</head>
<body>
<p><img src="images/banner.jpg" alt="" class="round">
<img src="images/banner.jpg" alt="" class="round">
<img src="images/banner.jpg" alt="" class="round"></p>
</body>
</html>
Профиль
29.05.2013 10:13:51 как сделать круглую ссылку круглой Сообщение #7
andrey-k

andrey-k

Новичок

Новичок

Дата регистрации:
28.05.2013 18:57:31

Сообщений: 4

Спасибо за ответ Михаил, но поинтер начинает срабатывать в углах за пределами бордера, а этого не должно быть,т.к. там прозрачность, как-будто у картинки нет угла - она круглая.
Профиль
01.06.2013 22:25:42 как сделать круглую ссылку круглой Сообщение #8
Дмитрий184

Дмитрий184

Мастер

Мастер

Дата регистрации:
29.06.2012 08:48:56

Сообщений: 225

Картинка всегда имеет форму прямоугольника, свойство border-radius делает только видимость закругления, но не меняет прямоугольную форму картинки.

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

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