在图片上实现定位

设计师给了份psd文件，部分图片如下：



其实是实现返回顶部的功能。

刚开始是想将返回顶部 那一块切出来，然后进行定位，但实现的效果不佳，一个是图片变形，一个是位置不精确，最后决定不切出来，直接使用一个div覆盖在返回顶部 那个图标上面，然后给div添加点击事件。主要代码如下：

<div class="last">
<img class="my-img" src="image/tail.jpg">
<a href="#top"><div class="backtop-pic"></div></a>
</div>

.last{
position: relative;
width: 100%;
}
.backtop-pic{
position: absolute;
width: 24%;
height: 6%;
bottom: 7%;
left: 38%;
}

用的是百分比，这样无论屏幕大小如何变化，都不影响div相对于返回顶部 那个图标的位置。