Question

我已创建SVG张Inkscape个SharePoint内嵌Inkscape页面的图像。我经常在onmouseover: this.style.opacity=0 onmouseout: this.style.opacity=1（对象属性 - ＆gt;交互性）中使用这两个属性：

onclick

这允许将对象隐藏在顶部以显示我放在后面的另一个对象。

使用onclick: this.object.lower...属性，有没有办法将顶部的对象降低到背景？像0 * * * * bash -c "date +'\%Y\%m\%d\%H\%M' | tr '\n' ' ' && uptime" >> /tmp/uptime.log

这样的东西

Answer 1

更低的是你的意思是移动它在页面上的位置？或者更改图像显示的页面的哪一层？鉴于OnMouseOver示例，我猜测后者。您根本不需要使用onclick。设置应该是'后面'的SVG图像作为父div的背景。然后使用background-color和background-image设置最前面的一个：url（'path / to / my.svg'）。

<style>
.backgroundImage, .foregroundImage {height:5em;width:5em;}
.backgroundImage {background:url('../img/logo.png') #fff center center no-repeat; background-size:4em 4em;}
.foregroundImage {background:url('../img/logo.png') red center center no-repeat; background-size:1em 1em;}
.foregroundImage:hover {background:none;}
</style>
<div class="backgroundImage"><div class="foregroundImage"></div></div>

你可以在这里看到一个确切如何做到这一点的例子jsFiddle - 我没有任何方便的图像所以我只是将他们的徽标用于背景网址

SVG onclick下方对象到底部

1 个答案: