JQuery Draggable和一个SVG?

前端之家收集整理的这篇文章主要介绍了JQuery Draggable和一个SVG?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在一个表格单元格中显示的对象标签中有一个SVG文件,我想使用 JQuery的Draggable使SVG在表格单元格内可拖动.代码 – 减去标记中令人困惑的位,如下所示:
<div id="container">
<div id="Box">
  <table align="center" border="1">
      <tr>
          <td valign="middle">button</td>
          <td valign="top" id="objtd">
              <div id="objdiv1">
                  <object id="svgobject1">blah,blah</object>
              </div>
          </td>
          <td valign="middle">button</td>
      </tr>

如果我将标记本身设置为可拖动,则可拖动不起作用.如果我将标签包装在a中并使其成为可拖动的,我可以使用div的边距而不是SVG本身进行拖动.我试着像这样设置SVG对象的句柄:

$('#objdiv1').draggable({ handle: '#svgobject1' });

但那也失败了.

有没有办法通过单击并拖动SVG本身来使SVG对象可拖动?

我设置了一个示例here,以防有助于了解我在说什么.

解决方法

HTML内容无法在< object>的内容上看到鼠标事件.如果负责的插件故意通过自定义界面提供,则页面中的脚本只能访问鼠标交互数据.

我建议将SVG内容作为页面本身的一部分,而不是使用< object>.这意味着您必须将该页面作为application / xhtml xml提供,并为SVG元素添加命名空间. Example.使用内联SVG,SVG元素本身可以响应鼠标事件,并且可以像HTML元素一样编写脚本.

内联SVG的缺点是它不适用于带有SVG插件的IE.但是,无论如何没有人使用插件多年,IE9也将支持内联SVG.

猜你在找的jQuery相关文章