it-swarm.com.ru

CSS перевод не работает в IE11 на SVG

Я хочу переместить группу элементов svg с помощью тега G, но в IE это не работает, даже в последней версии. Работает во всех других браузерах. Пожалуйста помоги.

Нужно ли использовать какой-то другой способ перемещения группы элементов в SVG?

http://jsfiddle.net/ahKpq/3/

<svg viewbox="0 0 20 20">
    <g>
        <circle cx=10 cy=10 r=10 />
    </g>
</svg>

g {
    transform: translate(10px, 0px);
    -ms-transform: translate(10px, 0px);
    -sand-transform: translate(10px, 0px);
    -webkit-transform: translate(10px, 0px);
}
17
Curtis

IE11 поддерживает атрибут transform, хотя он не распознает стиль CSS.

Таким образом, вы можете просто установить атрибут в соответствии со стилем, используя JavaScript:

var g= document.querySelector('g'),
    transform= getComputedStyle(g).getPropertyValue('transform');

g.setAttribute('transform', transform);

Fiddle

28
Rick Hitchcock

если кому-то все еще нужно это с jQuery, это работает для меня:

jQuery("g").each(function(){
        transform = jQuery(this).css('transform');
        console.log(transform);
        jQuery(this).attr('transform',transform);
    });
5
another user

Извините, Кертис, у вас нет шансов получить эту работу (по состоянию на 20.02.2015) - см. Официальную страницу ie здесь: https://connect.Microsoft.com/IE/feedback/details/811744/ie11-bug-with- реализация-css-transforms-in-svg

4
Kjell

Используйте атрибут transform

transform = "translate (10, 0)"

Работает как шарм на IE.

Если вы хотите изменить его на лету, используйте JS

0
MaakuW

если кому-то все еще нужно это с angularjs, это работает для меня:

.directive('ieTransform', function ($window) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var elementStyleMap = $window.getComputedStyle(element[0], null);
            var transform = elementStyleMap.getPropertyValue('transform');

            element[0].setAttribute('transform', transform);
        }
    };
})
0
Eydrian