Пользовательская HTML-встроенная SVG-анимация не работает в IE 11?

Question

Я использую webflow и встраиваю собственную HTML SVG анимацию в фон страницы. Отлично работает во всем, кроме Internet Explorer 11. Как я могу это исправить, чтобы он работал во всех браузерах?

Я попытался поместить на страницу код CSS, чтобы определить, был ли он в Internet Explorer 11, но я не очень знаком с CSS, и он просто заставил волны исчезнуть.

https://proj -24e99d.webflow.io /

Answer 1

Был бы способ определить, использует ли пользователь IE 10 или IE 11, чтобы он мог отображать анимацию как одно изображение, покрывающее страницу, но в противном случае использовать волновую анимацию?

Вы можете использовать следующий код для определения версии браузера:

<style type="text/css">
    body {
        font: 1.25em sans-serif;
        background-color:palegreen;

    }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
        /* IE10+ specific styles go here */
        body{
            background-color:aqua;
        }
    }
</style>

Подробнее, пожалуйста, проверьте эту тему .

Кроме того, оSVG-анимация, как обходной путь, я думаю, вы можете попробовать использовать .GIF-файл для отображения анимации (волны), установить его в качестве фонового изображения.

Answer 2

Насколько я знаю, IE 10 и 11 поддерживают только анимацию с программными сценариями. Надеюсь, что ниже ссылки ниже понять больше. https://docs.microsoft.com/en-us/previous-versions/windows/internet-explorer/ie-developer/samples/gg193979(v=vs.85)