Условно меняющий тип пантомимы с помощью jQuery и Modernizr

Question

Условно меняющий тип пантомимы с помощью jQuery и Modernizr

0

<object type="image/svg+xml" data="/images/ampersand.svg"></object>
<object type="image/png" data="/images/ampersand.png"></object>

В основном, используя jQuery, я хочу изменить.SVG на PGG, для браузеров без поддержки svg (я буду использовать modenizr, чтобы обнаружить это).

Я пробовал кучу разных способов без радости.

Любая помощь будет оценена по достоинству.

Paul Browne 09 нояб. 2013, в 14:26

Источник

Теги:

jquery

object

svg

mime-types

modernizr

2 ответа

2

Пытаться

$(document).ready(function () {
    function supportsSvg() {
        return document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Shape", "1.0");
    }
    if (!supportsSvg()) {
        $('object[type="image/svg+xml"]').prop('type', 'image/png').prop('data', function (_, old) {
            return old.replace('.svg', '.png');
        });
    }
});

Заменить код в DOM ready

Читать

http://learn.jquery.com/using-jquery-core/document-ready/

http://api.jquery.com/ready/

Tushar Gupta 09 нояб. 2013, в 10:28

0

Разве вам не требуется supportsSvg() как это функция, которую вы вызываете?
Lugia101101 09 нояб. 2013, в 13:29
0

@ Lugia101101 да, пропустил слишком быстро. Ты обновлен.
Tushar Gupta - curioustushar 09 нояб. 2013, в 13:30
0

Я должен добавить это к голове, или перед / body?
Paul Browne 09 нояб. 2013, в 13:57
0

@PaulBrowne проверить обновленный ответ. Теперь вы можете написать этот код в любом месте на странице.
Tushar Gupta - curioustushar 09 нояб. 2013, в 14:01
0

Не работает, проверьте paul-browne.github.io/articlr амперсанд и не должен заполнять экран
Paul Browne 09 нояб. 2013, в 14:17
0

@PaulBrowne Попробуй if (supportsSvg()) { supportSvg if (supportsSvg()) { вместо if (!supportsSvg()) {
Tushar Gupta - curioustushar 09 нояб. 2013, в 14:26

Показать ещё 4 комментария

Ещё вопросы

Разве вам не требуется supportsSvg() как это функция, которую вы вызываете?
@ Lugia101101 да, пропустил слишком быстро. Ты обновлен.
Я должен добавить это к голове, или перед / body?
@PaulBrowne проверить обновленный ответ. Теперь вы можете написать этот код в любом месте на странице.
Не работает, проверьте paul-browne.github.io/articlr амперсанд и не должен заполнять экран
@PaulBrowne Попробуй if (supportsSvg()) { supportSvg if (supportsSvg()) { вместо if (!supportsSvg()) {

Thomas W · Accepted Answer · 2013-11-09T14-08-00.000Z

Сегодня я узнал об этом (IMHO действительно потрясающее) решение только для HTML. Работает отлично, чтобы дать откат в IE 6:

<object data="/images/ampersand.svg">
  <img src="/images/ampersand.png">
</object>

обратите внимание, что есть недостаток: это заставит браузеры загружать оба ресурса.