gpt4 book ai didi

css - 从 SVG 文档中的链接打开 CSS 模态框

转载 作者:行者123 更新时间:2023-11-28 14:15:43 26 4
gpt4 key购买 nike

我想根据http://www.paulrhayes.com/2011-03/css-modal/实现一个模态框单击 SVG 文档中的元素时打开。

这是一个示例代码:

<svg ...>
<g id="ra">
<a xlink:href="#r1" class="openModal">
<g id="r">
<rect x="136.63" y="98.893" fill="#000000" width="58.79" height="91.313"/>
</g>
</a>
</g>
</svg>
<aside id="r1" class="modal">
<div>
<h2>Modal box</h2>
<p>Lorem Ipsum</p>
<a href="#close" title="Close">Close</a>
</div>
</aside>

好吧,正如您所猜到的。此代码无效。也许你能帮忙?非常感谢。

最佳答案

你是不是忘了包含 css?一旦你这样做,它对我有用。

<!DOCTYPE html>
<html>
<link rel="stylesheet" type="text/css" href="http://www.paulrhayes.com/experiments/modal/css/experiment.css"/>
<svg>

<a xlink:href="#r1" class="openModal">
<g id="r">
<rect x="136.63" y="98.893" fill="#000000" width="58.79" height="91.313"/>
</g>
</a>
</g>
</svg>
<aside id="r1" class="modal">
<div>
<h2>Modal box</h2>
<p>Lorem Ipsum</p>
<a href="#close" title="Close">Close</a>
</div>
</aside>
</html>

关于css - 从 SVG 文档中的链接打开 CSS 模态框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9064939/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com