jquery - JQueryでホバー時に埋め込まれたSVGファイルの塗りつぶしの色を変更するには?

Question

SVG 埋め込み要素 (外部ファイル) を含む大きな要素があります。a:hover で塗りつぶしの色を変更したいと思います。どのようにアプローチしますか？それは本当に私を夢中にさせます:)

私がうまくいくはずだと思ったのは：

$("a#title").hover(function() {
$("svg#logo").attr('fill','#f0f');
});

Answer 1

svgがhtmlにインラインである場合、あなたが持っているものは大丈夫です。ただし、参照（embed、object、iframe、img）で埋め込まれている場合、svgは実際には別のドキュメントです。これは、iframeによって参照されたhtmlドキュメントの属性を変更しようとしていると考えることができます。

リンクはsvg内にありますか？もしそうなら、あなたはsvgの中にスタイル/スクリプトを置くことができます。

これは、htmlドキュメント（埋め込み、オブジェクト、iframe）からsvg形状の塗りつぶしを変更する例です。

Answer 2

私はこれを具体的に行ったことはありませんが、この男はここにある使用できる jquery プラグインを持っているようです。