如何在图片上弹出链接?

时间:2015-01-30 06:52:43

标签: jquery css3

请告诉我如何做出如下决定:http://aqvatarius.com/themes/atlant_v1_6/html/pages-gallery.html。 我需要这样做,当你将鼠标悬停在图像上以弹出具有两个链接的块时,一个用于编辑另一个要删除的图片。以下是如何显示图像的示例:

<a href="http://placehold.it/400x400&text=Photo+2" title="Apple">
<img src="http://placehold.it/100x100&text=Thumbnail-2" alt="Apple" class="img-thumbnail">
</a>

以下是演示:http://jsfiddle.net/3su8Y/

1 个答案:

答案 0 :(得分:0)

试试看jsfiddle:http://jsfiddle.net/3su8Y/7/

.row a {
    float: left;
    height: 100px;
    margin-right: 15px;
    overflow: hidden;
    position: relative;
    width: 100px;
}
.row a:hover ul{right:5px;}
.row a > ul {
    list-style: outside none none;
    margin: 0; transition: all 200ms ease 0s;
    overflow: hidden;
    padding: 0;
    position: absolute;
    right: -49px;
    top: 0;
    width: 48px;
}