Question

如何使用Lightbox2显示div内包含的SVG？在下面的示例中，我想加载div中包含的标识为testsvg的SVG：

<div id="testsvg">
    <svg width="400" height="180">
    <rect x="50" y="20" width="150" height="150" style="fill:blue;stroke:pink;stroke-width:5;opacity:0.5"> 
    </svg>
</div>

<a href="#testsvg" data-lightbox="image-1" data-title="My caption">Test SVG!</a>

Answer 1

试试这个

body {
  position: relative;
}
#testsvg + a {
  position: absolute;
  top: 43%;
  left: 11%;
}

<div id="testsvg">
  <svg width="400" height="180">
    <rect x="50" y="20" width="150" height="150" style="fill:blue;stroke:pink;stroke-width:5;opacity:0.5">
  </svg>
</div>

<a href="#testsvg" data-lightbox="image-1" data-title="My caption">Test SVG!</a>

使用Lightbox2加载div中包含的SVG

1 个答案: