求助div层问题

来源：百度知道 编辑：UC知道 时间：2024/05/29 18:36:56
本人刚学习div。

现在想做个通过点击单选按钮，出现相对的图片（图片在div层中，要求使用z-index来做）

希望高手帮个忙，我很急切。解决问题后给50分，谢谢各位；
比如有2个单选按钮，一个兔子，一个老虎
我选择 兔子。出现兔子图片
当我又选择老虎时，出现老虎图片，同时兔子图片消失。

用z-index可以控制层的层叠关系，该值越大，层级越靠上，比如z-index为2的就放在为1的上面，但是要使z-index有效，需要把position属性设为absolute。下面为你要的代码，通过更改z-index的值来控制两个div的显示和隐藏。

<input type="button" value="老虎" onclick="tiger.style.zIndex=2;rabbit.style.zIndex=1;"/>
<input type="button" value="兔子" onclick="tiger.style.zIndex=1;rabbit.style.zIndex=2;"/>
<div style="position:relative;">
<div id="tiger" style="position:absolute;y:100px;width:100px;height:100px;background:white;z-index:2">这放老虎</div>
<div id="rabbit" style="position:absolute;y:100px;width:100px;height:100px;background:white;z-index:1">这放兔子</div>
</div>