jquery - 将 jQuery 与 Raphael 一起使用

标签 jquery svg raphael

我和拉斐尔一起创建了一个图像映射。我希望当单击图像映射中的路径之一(下例中的路径 10)时,包含 Raphael Canvas 的 div 使用 jQuery 淡出。下面的代码不起作用,但我走在正确的轨道上吗?

<script type="text/javascript" charset="utf-8">
    window.onload = function () {
        var R = Raphael("canvas", 1050, 550);
        var attr = {
            fill: "#bbb",
            "fill-opacity": 1,
            stroke: "#222",
            "stroke-width": 0.3,
            "stroke-linejoin": "round"
        };
        path10 = R.path("m 221.63509,150.81487 97.24682,0 0,89.68452 -97.24682,0 0,-89.68452 z").attr(attr);
    };

    path10.node.setAttribute("id","barry");

    $(document).ready(function(){
        $("#barry").click(function(){
            $("#canvas").fadeOut();
        });
    });

</script>

<body>
    <div id="canvas"></div>
</body>

最佳答案

快到了...这可以工作(在 Firefox 3.6.8 上测试):

<body>
<script type="text/javascript" charset="utf-8">
    $("document").ready(function() {
        var R = Raphael("canvas", 1050, 550);
        var attr = {
            fill: "#bbb",
            "fill-opacity": 1,
            stroke: "#222",
            "stroke-width": 0.3,
            "stroke-linejoin": "round"
        };
        path10 = R.path("m 221.63509,150.81487 97.24682,0 0,89.68452 -97.24682,0 0,-89.68452 z").attr(attr);
        path10.node.setAttribute("id","barry");

        $("#barry").click(function(){
            $("#canvas").fadeOut();
        });     
    });

</script>

<div id="canvas"></div>
</body>

关于jquery - 将 jQuery 与 Raphael 一起使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3613636/

相关文章:

label - 拉斐尔 JS : mouseover/mouseout - problem with text-labels

jquery - fancybox2 在 ajax 上的第二次调用时不起作用

javascript - RadioButton 不访问搜索使用 Jquery Ajax

javascript - Chrome 在打印时通常不显示内联 SVG 图像

javascript - d3.create() 返回一个带.node() 的元素,但在浏览器中不显示

javascript - 如何沿给定路径拖动形状

onclick - 当页面上有多个对象时,更改单个 RaphaelJS 对象的笔划属性

javascript - ie9 和 opera 的 jquery 对象问题

javascript - Jquery 数据表复选框

css - 我在 React 元素中修改 svg 组件的一些属性值时遇到问题