css - 将类（fancybox）分配给 SVG 元素

Question

我正在尝试为 SVG 元素分配一个类（video.js）。不知何故，这个类被禁用了。我在下面的尝试不起作用。

<a class="video" xlink:href="http://www.youtube.com/v/ZeStnz5c2GI?fs=1&amp;
autoplay=1" title="The Falltape"><circle cx="168" cy="79" r="59" fill="green" />
</a>

当我把它和一些纯文本放在一起时，它工作正常，没有 SVG-circle

<a class="video" title="The Falltape" href="http://www.youtube.com/v/ZeStnz5c2GI?
fs=1&amp;autoplay=1"><img src="images/1.jpg" alt="" />TEXT</a>

链接到 video.js

Query(document).ready(function() {

$(".video").click(function() {
    $.fancybox({
        'padding'       : 0,
        'autoScale'     : false,
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'title'         : this.title,
        'width'         : 853,
        'height'        : 480,
        'href'          : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
        'type'          : 'swf',
        'swf'           : {
        'wmode'         : 'transparent',
        'allowfullscreen'   : 'true'
        }
    });

    return false;
  });
});

有什么建议么？

Answer 1

Don't put the class attribute into the XLink namespace, put the href attribute into the XLink namespace:

<a class="video" xlink:href="http://www.youtube.com/v/ZeStnz5c2GI?fs=1&amp;
autoplay=1" title="The Falltape"><circle cx="168" cy="79" r="59" fill="green" />
</a>

Make sure that the SVG around this is correct, too.