原理很简单,先上代码:
<div id="share" style="display:none;"> <img width="100%" height="100%" src="share.png" style="position:fixed;z-index:9999; top:0 ; left:0 ; " ontouchstart="document.getElementById('share').style.display='none';"/> </div>
其大概意思是,开始是隐藏的,然后share的div显示,图片share.png跟着显示,图片的位置 fixed,显示在最前面,图片距离顶部是0px,距离左边也是0。这样就能展示一个满屏的图片了。元素框的表现类似于将 position 设置为 absolute,不过其包含块是视窗本身。然后显示!
而箭头点击上方分享就是图片share.png里面的内容啦。。