SVG添加链接(转载)
转载地址:http://tech.techweb.com.cn/thread-258715-1-1.html
最基本的交互形式是链接。在 SVG 中,通过一个 <a> 标签提供链接,这与 HTML 链接的方式几乎相同。将 <a> 标签与一个 xlink:href 属性结合使用便可以建立一个链接。在 <a>和 </a> 标签之间的所有内容都作为链接的一部分。清单1展示了一个例子,它有三个元素,设置为链接到三个不同的 URL。单击这里以在浏览器中查看它们。
文本、矩形和多边形元素都有到不同页面的链接,这表明所有 SVG 元素 -- 不管是文本、圆还是不规则的多边形 -- 都可以作为一个链接。注意,如果将鼠标移动到这些元素上面,指针会相应地发生改变,表明这是一个链接。
其功能与 HTML 中的 image map(或者 hotspot)基本上相同。不过,在 HMTL 中这会是一个很麻烦的过程,要用专门的软件在一个图像上手工绘制热点 -- 如果这个图像或者链接改变了,那么更新它们会非常麻烦。在 SVG 中,定义和维护链接则容易得多,这主要是因为链接可以随着 SVG 内容动态移动。
<svg>
<a href="http://www.w3.org//Graphics//SVG//Overview.htm8">
<rect x="10" y="10" width="100" height="30" rx="10" ry="10"
style="fill:lightgrey"/>
<text x="30" y="30" font-size="12">Click here</text>
</a>
<a href="http://www.ibm.com//developerworks/">
<circle cx="100" cy="100" r="50" style="fill:grey"/>
<text x="80" y="100" font-size="12">Or here</text>
</a>
<a href="http://www.ibm.com/" target="new">
<polygon
points="60 160,165 172,180 60,290 290,272 280,172 285,250 255"
style="fill:dimgrey"/>
<text x="160" y="200" font-size="12">Or even here</text>
</a>
</svg>
注意在多边形的 中使用的 target="_blank"属性。它指示查看程序在单击这个元素时打开一个新的浏览器窗口。
SVG添加链接(转载)的更多相关文章
- visual studio 添加链接文件
本文转载http://blog.163.com/zhongpenghua@yeah/blog/static/87727415201282432345613/ 那个有个箭头的文件就是链接文件了,添加 ...
- sqlserver 多库查询 sp_addlinkedserver使用方法(添加链接服务器)
sqlserver 多库查询 sp_addlinkedserver使用方法(添加链接服务器) 我们日常使用SQL Server数据库时,经常遇到需要在实例Instance01中跨实例访问Instanc ...
- linux下添加链接与删除链接(ln命令的用法)
添加链接使用ln命令用法:#ln --help用法:ln [选项]... 目标 [链接名]或:ln [选项]... 目标... 目录或:ln [选项]... --target-directory=目录 ...
- easyui的datagrid行的某一列添加链接
通过formatter方法给easyui 的datagrid 每行增加操作链接. 效果图 jsp代码: <th field="url" width="100&quo ...
- HTML之学习笔记(六)添加链接
html添加链接所用的标签为<a>标签 语法: 定义:从当前页面,跳转到指定页面或文件的一个标签 <a href="URL">热点文字 ...
- ckeditor自定义插件--一键给所有的图片添加链接
ckeditor自定义插件在网上查了查,感觉还是比较好用的,写了一个一键给编辑器中的所有图片添加链接. 在ckeditor目录下的plugins下建以插件为名的文件夹,在里边建plugin.js文件, ...
- WordPress文章自动提取tag并添加链接
我们在编写文章时,经常需要添加一些标签关键词的链接,这样不仅可以优化我们的内链,对用户来说也可以参照相关的文章,如果对文章的关键字进行手动添加链接,那样对我们来说太麻烦了,而且在标签关键词很多的情况下 ...
- Bootstrap历练实例:向列表组添加链接
向列表组添加链接 通过使用锚标签代替列表项,我们可以向列表组添加链接.我们需要使用 <div> 代替 <ul> 元素.下面的实例演示了这点: <!DOCTYPE html ...
- SQLServer添加链接服务器
右键,添加链接服务器 在安全里面输入用户名和密码 添加成功之后的使用方法 select * from [192.168.1.63,3326].[数据库].[dbo].[表]
随机推荐
- SAP 中如何寻找增强
http://blog.csdn.net/edifierliu/article/details/5978824 查找SAP标准事务代码中使用的BADI: 在SE24中,查看类对象CL_EXITHAND ...
- HDOJ-三部曲一(搜索、数学)-1012-Shredding Company
Shredding Company Time Limit : 2000/1000ms (Java/Other) Memory Limit : 20000/10000K (Java/Other) T ...
- 【Zhejiang University PATest】02-1. Reversing Linked List
Given a constant K and a singly linked list L, you are supposed to reverse the links of every K elem ...
- ASP.NET之Ajax系列(三)
我们通过前两篇文章的学习,已经大致掌握了Ajax的实现方法,同时也可以对比出两种方式的优劣.但是我们还是没有搞清楚真正的ajax的实现原理,以及最原始的,未经过封装的ajax是什么样的,今天我们一起来 ...
- Android布局大全
Android的界面是有布局和组件协同完成的,布局好比是建筑里的框架,而组件则相当于建筑里的砖瓦.组件按照布局的要求依次排列,就组成了用户所看见的界面. 所有的布局方式都可以归类为ViewGroup的 ...
- Java 解惑:Random 种子的作用、含参与不含参构造函数区别
Random 通常用来作为随机数生成器,它有两个构造方法: Random random = new Random(); Random random2 = new Random(50); 1.不含参构造 ...
- ASP.NET获取客户端及服务器的信息
客户端信息: 1. 在ASP.NET中专用属性: 获取服务器电脑名:Page.Server.ManchineName 获取用户信息:Page.User 获取客户端电脑名:Page.Request.Us ...
- C# 控件不刷新问题
/********************************************************************** * C# 控件不刷新问题 * 说明: * 当网络连接出问 ...
- 《单页Web应用--温故JavaScrpt》学习笔记整理
变量作用域,函数提升和执行环境对象 1. 变量作用域 在 JavaScript 中,变量 的 作用域 由 函数 限定,即:唯一能定义变量作用域的语块就是 函数. 变量 要么是全局的,要么是局部的. ...
- 【avalon】createMap
/** * Creates a new object without a prototype. This object is useful for lookup without having to * ...