Ich habe eine SVG, die einige linearGradient-Elemente enthält, die sich beim Klicken auf die Schaltfläche ändern. Alles funktioniert gut, wie Sie hier sehen können . Meine Frage ist, wie könnte ich dasselbe tun, wenn die SVG-Datei aus meinem Beispiel eine externe Datei ist und in einem <object>Tag aufgerufen wird ?
Mein SVG:
<object data="Img/PumpStation/Pump.svg" type="image/svg+xml" id="alphasvg1111"></object>
Mein Knopf:
<asp:Button ID="Button1" class="test" runat="server" Text="Button" />
Meine jQuery-Funktion:
jQuery('.test').on('click', function () {
//$("object").contents().find("path").attr({ "fill": "red" });
jQuery('object stop').each(function () {
var color = jQuery(this).css('stop-color');
if (color === 'rgb(77, 77, 77)') {
jQuery(this).css('stop-color', '#ff0000');
}
});
});
Wenn ich Folgendes verwende: $("object").contents().find("path").attr({ "fill": "red" });, wird mein SVG rot, wenn auf die Schaltfläche geklickt wird. Warum funktioniert der Rest der Funktion nicht?
Sie müssen den Inhalt des Objektelements abrufen:
jQuery('.test').on('click', function () {
$("object").contents().find('stop').each(function () {
var color = jQuery(this).css('stop-color');
if (color === 'rgb(77, 77, 77)') {
jQuery(this).css('stop-color', '#ff0000');
}
});
});
Dieser Artikel stammt aus dem Internet. Bitte geben Sie beim Nachdruck die Quelle an.
Bei Verstößen wenden Sie sich bitte [email protected] Löschen.
Lass mich ein paar Worte sagen