Javascript 打开从Raphael节点到灯箱的链接

我用它来满足我的灯箱需求

我需要打开一个元素的链接（在这个演示中）

通常，您会创建一个链接，并按如下方式设置其样式：

<a id="test" href="ajax.html">Click Me</a></li>
<script type="text/javascript">
$(document).ready(function() {
    $('#test').fancybox({
        'width'           : '75%',
        'height'          : '75%',
        'autoScale'       : false,
        'transitionIn'    : 'none',
        'transitionOut'   : 'none',
        'type'            : 'iframe'
    });

所以我尝试了几种方法来设计链接的样式。一个天真的尝试是简单地将test的id添加到attr中

我还尝试了以下方法：

$(circle.node).fancybox({
$('circle.node').fancybox({
$('#circle.node').fancybox({
$('#canvas.circle.node').fancybox({
$('#Demo.circle.node').fancybox({

它们都不起作用。链接始终作为新链接打开，而不是在花式框中打开

我做错了什么？我需要做什么来纠正它？

修复了它

我没有使用href属性，而是直接从该节点的onclick处理程序中调用了fancybox，从而得到以下结果：

    var circle = this.paper.circle(150, 120, 100);
    circle[0].style.cursor = "pointer";
    circle.attr({
        fill: "green",
        stroke: "#333",
        "stroke-width": 10,
    });
    circle.node.onclick = function () {
        $.fancybox({
            'href'          : 'ajax.html',
            'width'         : '75%',
            'height'        : '75%',
            'autoScale'     : false,
            'transitionIn'  : 'none',
            'transitionOut' : 'none',
            'type'          : 'iframe'
        });

        if (circle.attr("fill") == "red") {
            circle.attr("fill", "green");
        } else {
            circle.attr("fill", "red");
        }
    };

真管用

$(circle.node).fancybox({
$('circle.node').fancybox({
$('#circle.node').fancybox({
$('#canvas.circle.node').fancybox({
$('#Demo.circle.node').fancybox({

    var circle = this.paper.circle(150, 120, 100);
    circle[0].style.cursor = "pointer";
    circle.attr({
        fill: "green",
        stroke: "#333",
        "stroke-width": 10,
    });
    circle.node.onclick = function () {
        $.fancybox({
            'href'          : 'ajax.html',
            'width'         : '75%',
            'height'        : '75%',
            'autoScale'     : false,
            'transitionIn'  : 'none',
            'transitionOut' : 'none',
            'type'          : 'iframe'
        });

        if (circle.attr("fill") == "red") {
            circle.attr("fill", "green");
        } else {
            circle.attr("fill", "red");
        }
    };