Как использовать .contentDocument в пути переменной .hover? - PullRequest
Новая
       36

Как использовать .contentDocument в пути переменной .hover?

0 голосов
/ 22 января 2020

У меня загрузка SVG выглядит следующим образом: 

<object id="svg-object" type="image/svg+xml" width="1400px" height="900px" data="media/1.svg?"></object>

Затем у меня есть функция, которая работает, вызывая один элемент в этом svg и применяя стиль к нему просто отлично. Вот событие onload, которое работает для правильного получения элемента: 

window.onload=function() {
    var svgObject = document.getElementById('svg-object').contentDocument;
    var element = svgObject.getElementById('sprite1');
};

Но как мне установить .hover даже для этого же элемента? Я пробовал: 

$('#${element}').hover(function(e) { }

Но не повезло.

Кроме того, как я могу применить переменную svgObject ко всему классу, например, к пути или многоугольнику? Я использую это в локальном встроенном SVG, и он отлично работает: $ ("polygon, path"). Hover (function (e) {}

Я хотел бы, чтобы это работало и над объектом, встроенным в SVG. .

1 Ответ

0 голосов
/ 22 января 2020

Извините, я не могу добавить внешний svg во фрагмент (или, по крайней мере, не знаю как), так как внешний URL не будет загружен в объект. И это нужно загрузить как объект для вас, чтобы увидеть проблему.

Любая помощь?

Кроме того, вот код, который работает, определяя цвет элемента из скрипта, но не работает и при наведении курсора. (пробовал вместо парения) 

    window.onload=function() {
    var svgObject = document.getElementById('svgEmb').contentDocument;
    var element = svgObject.getElementById('left');
    element.style.fill = "blue";
    element.style.stroke ="blue";
};
element.addEventListener("mouseover", function() {
    element.style.fill = "red";
    element.style.stroke ="red";
});
...