具体效果请查看原文
krpano制作的全景在国内应用最多的场景应该就是在微信上展示。因为微信往往与公众号有关系，客户希望在展示全景的同时也希望用户能够关注其公众号。关注公众号的办法很多，其中一种就是在微信中长按二维码进行识别，然后便跳转到其公众号页面中。
因此以下都是按照HTML5的情况进行讲解：
如果我们在krpano使用layer进行弹出图片，无论怎么长按都是识别不了。但我们知道普通页面放个img标签的二维码是可以正常在微信的浏览器识别的。于是按照这个思路，决定做个div将img标签放在其中，然后要把这个div放在全景所在的div的后面，也就是在html文件中，二维码div要在全景的div的后面，不然的话弹出来也是会被挡住（这个在后面证明其实意义不大）。
也就是我们有一个按钮实现了html中img标签的图片的弹出。但问题是还是识别不了。这是怎么回事呢？于是尝试着把全景这个div删除掉，发现是可以识别二维码的。原来如此，在全景这个div显示的情况下是识别不了的。但我们不可能说真的删掉全景这个div，我们可以用隐藏div的方法。也就是在xml中我们这样写：
<layer name="counttext" url="%SWFPATH%/plugins/textfield.swf" vcenter="true" visible="true" alpha="1" html="二维码" autowidth="true" keep="true" autoheight="true" align="bottom" x="0" y="4%" css="font-family: Verdana; font-size:40px; color:#00AFC4; text-align:center; line-height:36px;" padding="5" roundedge="5" background="true"
backgroundcolor="0x000000" state="closed"
backgroundalpha="0.65" border="true" enabled="true"
bordercolor="0x00AFC4"
borderalpha="1.0"
borderwidth="5.0" onclick="if(state == closed,qrcode();set(state,opend),qrcode2();set(state,closed));"/>
<action name="qrcode">
jscall('dingwei.style.visibility = "visible";');
jscall('pano.style.visibility = "hidden";');
</action>
<action name="qrcode2">
jscall('dingwei.style.visibility = "hidden";');
jscall('pano.style.visibility = "visible";');
</action>
counttext是一个按钮，实现弹出二维码的功能。我们给这个按钮加了一个自定义属性为state来记录目前是哪个状态，从而决定点击按钮是显示二维码还是关闭二维码。
qrcode和qrcode分别对两个div对象进行了隐藏和显示。在显示二维码的时候就隐藏pano，在关闭二维码时就显示pano。pano也就是全景本身。注意不包括layer以及hotspot。也就是我们尽管关闭了全景图的显示，但对应的layer和hotspot还是会显示的，因此建议另外加一层全屏的背景层来遮挡住皮肤，也可以另外在这个时候显示一个关闭按钮在右上角，取代二维码的关闭功能。
下面是html的代码部分。注意只需要确定二维码一开始是隐藏的。
<style>
a{ color:#fff;}
#dingwei{
padding:10px;
z-index:100;
background-color:#000000;
filter:Alpha(opacity=0);
color:#FFFFFF;
visibility:hidden;
width:500px;
height:500px;
display:block;
position: absolute;
top:50%;
left:50%;
margin-left:-250px;
margin-top:-250px;
}
img{
max-width:90%;height:auto;
}
</style>
<script src="tour.js"></script>
<div id="pano" style="width:100%;height:100%;">
<noscript><table style="width:100%;height:100%;"><tr style="vertical-align:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript>
<script>
embedpano({swf:"tour.swf", xml:"tour.xml", target:"pano", html5:"prefer" });
</script>
</div>
<div id="dingwei">
<div align="center" ><img src="qrcode.jpg" height="400" width="400"/></div>
</div>
红色的两个div就是我们在xml操作的对象。注意xml中jscall仅适用于krpano 1.19，其它版本可以直接使用js。
联系客服
