diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/zh-cn/web/svg/linking/index.html | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/zh-cn/web/svg/linking/index.html')
-rw-r--r-- | files/zh-cn/web/svg/linking/index.html | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/files/zh-cn/web/svg/linking/index.html b/files/zh-cn/web/svg/linking/index.html new file mode 100644 index 0000000000..ca96218a39 --- /dev/null +++ b/files/zh-cn/web/svg/linking/index.html @@ -0,0 +1,48 @@ +--- +title: Linking +slug: Web/SVG/Linking +translation_of: Web/SVG/Linking +--- +<div>SVG标签内的"a"元素上的“target”属性在Mozilla Firefox 1.5中不起作用。使用标记将SVG文档嵌入父HTML文档时:</div> + +<p>page1.html:</p> + +<pre class="brush: html;"><html> + <body> + <p>This is a SVG button:</p> + <object width="100" height="50" type="image/svg+xml" data="button.svg"/> + </body> +</html> +</pre> + +<p>button.svg:</p> + +<pre class="brush: xml"><?xml version="1.1" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg"> + <a xlink:href="page2.html" target="_top"> + <g> + <!-- button graphical elements here --> + </g> + </a> +</svg> +</pre> + +<p>规范规定,当单击按钮图形时,浏览器应导航到HTML document page2.HTML。但是,target不能与Mozilla在Firefox 1.5中实现的SVG<a>元素协同工作。(问题将在Firefox2.0中解决。)</p> + +<p>无论如何,Moz SVG中的结果行为是page2.html将被加载到SVG按钮所在的帧中(即,您现在将page2.html嵌入到page1.html中的100x50像素帧中)。</p> + +<p>要解决这个问题,需要一点难看的JavaScript编程:</p> + +<p>button.svg:</p> + +<pre class="brush: xml;"><?xml version="1.1" encoding="UTF-8"?> +<svg xmlns="http://www.w3.org/2000/svg"> + <g onclick="top.document.href='page2.html'" cursor="pointer"> + <!-- button graphical elements here --> + </g> +</svg> +</pre> + +<h2 id="例子">例子</h2> + +<p>有关此解决方案在工作中的示例,请参见www.codedeard.com。</p> |