Изображение в оттенках серого (SVG) - PullRequest
Новая
       3

Изображение в оттенках серого (SVG)

4 голосов
/ 26 февраля 2012

Пытался преобразовать изображение в оттенки серого и вернуть его к нормальному при наведении - глядя на Преобразовать изображение в оттенки серого в HTML / CSS

В IE все работает нормально для нормальногоиспользование фильтра, однако метод SVG в Firefox не так хорош.Все мои страницы живут в корне сайта, затем таблица стилей в /SiteStyles/Styles.css, в которой я называю .homeCaseStudyImage img {filter: url (filters.svg # grayscale);

My filters.svgтакже живет в каталоге / SiteStyles.Что выглядит следующим образом: 

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" baseProfile="full" xmlns="http://www.w3.org/2000/svg">
  <filter id="grayscale">
    <feColorMatrix type="matrix" values="0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0"/>
  </filter>
</svg>

Я знаю, что это работает для других, поэтому я предполагаю, что это связано либо с моей структурой папок, либо, возможно, не со ссылкой на что-то связанное с SVG?

Любая помощь приветствуется

1 Ответ

6 голосов
/ 27 февраля 2012

Убедитесь, что ваш сервер настроен на обслуживание .svg файлов с использованием SVG MIME типа image / svg + xml . Firefox будет игнорировать файлы SVG, которые не обслуживаются с правильным типом MIME.

...