непрямоугольная область обитания - PullRequest
4 голосов
/ 16 июля 2011

Я хотел бы иметь стрелку, которая будет что-то делать на :hover, но только когда сама стрелка наведена (не прямоугольник, который ограничивает ее ширину и высоту).

Короче говоря, при наведении на правый нижний и правый верхний углы ► ничего делать не должно.

Как бы мне этого добиться?

Ответы [ 3 ]

5 голосов
/ 16 июля 2011

Если у вас есть время - выучите SVG на JavaScript - тогда подобные вещи будут не более, чем детской игрой.

Некоторые полезные ссылки для SVG ...

http://www.w3.org/Graphics/SVG/

этот урок

http://raphaeljs.com/ (мой любимый)

http://keith -wood.name / svg.html

5 голосов
/ 16 июля 2011

С элементом карты HTML?См. <карта> .

Обновление:

Например, как в это демо :

img {
  border: 3px solid black;
}
<br />
<img id="img" src="http://upload.wikimedia.org/wikipedia/commons/thumb/3/3c/Black_triangle.svg/200px-Black_triangle.svg.png" usemap="#triangle" alt="" />
<map name="triangle">
    <area shape="poly" coords="3, 3, 195, 3, 100, 169"
        href="http://google.com" alt=""
        onmouseover="document.getElementById('img').style.borderColor = 'red';"
        onmouseout="document.getElementById('img').style.borderColor = 'black';"/>
</map>
2 голосов
/ 16 июля 2011

Вы можете использовать oldschool imagemaps или отслеживать движение мыши по событию mousemove , а затем выполнять вычисления координат x / y.

...