Маска Webkit с SVG

Question

У меня небольшая проблема с веб-страницей, которую я разрабатываю.

Я использую файл .SVG для маскировки части изображения.

Он работает правильно в Firefox, Safari, но работает только в Chrome под OS X.

Я хотел бы понять, почему? Есть идеи?

Вот пример страницы, где я получил ту же проблему: http://girliemac.com/sandbox/mask.html

Заранее спасибо,

Jk_

Answer 1

Попробуйте поэкспериментировать с разными значениями, например так:

-webkit-mask-box-image: url(svg/twitter-bird-new.svg) 100 100 0 0 round round;  

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

Источник: https://developer.mozilla.org/en/CSS/-webkit-mask-box-image

Answer 2

Это выглядит хорошо, но если вы jQuerify в Chrome и проведете тест на попадание:

$(".avatar").on("click", function(){ console.log("works!");});

Вы можете нажать на остальную часть окна ... в любом случае, я могу сделать что-то подобное ищелкнуть ПОД?Я пытаюсь замаскировать круг ... но я не хочу нажимать на круг в верхней части ... Я хочу щелкнуть на элементах внизу ... Например, если у вас есть десять центов на вершине четверти, а выможно увидеть край большой монеты как поднос ...