插件描述
这是一个基于xml代码开发的一个相册，同时支持电脑和移动设备拨动观看.
使用方法
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
插入xml插件 <include url="plugins/swipe_gallery.xml" /> <!-- 插入相册代码 --> <layer name="gallery" type="container" align="center" width="100%" height="100%" alpha="0" autoalpha="true" bgcolor="0x000000" bgalpha="0.8" keep="true"> <layer name="gallery_scrollarea" url="%SWFPATH%/plugins/scrollarea.swf" alturl="%SWFPATH%/plugins/scrollarea.js" keep="true" align="left" width="0" height="100%" zorder="1" direction="h" ondown="set(gallery_scrollarea_start_pos, get(x))"> </layer> <layer name="arrow_left" align="left" x="10" keep="true" visible="false" zorder="2" onclick="move_image(left)" url="img/arrow_left.png" /> <layer name="arrow_right" align="right" x="10" keep="true" visible="false" zorder="2" onclick="move_image(right)" url="img/arrow_right.png" /> <layer name="gallery_close" align="righttop" x="10" y="10" keep="true" zorder="2" onclick="hide_gallery()" url="img/close.png" /> </layer> <!-- 定义不同的相册 --> <gallery name="gallery1" title="Title of gallery 1"> <img name="img1" url="img/pic1.jpg" title="Escalator" /> <img name="img2" url="img/pic2.jpg" title="Mask" /> <img name="img3" url="img/pic3.jpg" title="Wallpaper" /> <img name="img4" url="img/pic4.jpg" title="F/A-18 C Hornet" /> <img name="img5" url="img/pic5.jpg" title="Forest" /> </gallery> <gallery name="gallery2" title="Some other pictures"> <img name="img1" url="img/pic6.jpg" title="A dog" /> <img name="img2" url="img/pic7.jpg" title="My cat" /> <img name="img3" url="img/pic8.jpg" title="Canal" /> <img name="img4" url="img/pic9.jpg" title="Aquarium" /> <img name="img5" url="img/pic10.jpg" title="Aquarium" /> <img name="img6" url="img/pic11.jpg" title="Aquarium" /> </gallery> |
相册打开方法
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<hotspot name="hs1" style="hs_gallery" ath="0" atv="0" galleryname="gallery1" /> <style name="hs_gallery" url="img/hs_gallery.png" onclick="show_gallery(get(galleryname))" onhover="showtext(get(gallery[get(galleryname)].title))" /> <gallery name="gallery1" title="Title of gallery 1"> <img name="img1" url="img/pic1.jpg" title="Escalator" /> <img name="img2" url="img/pic2.jpg" title="Mask" /> <img name="img3" url="img/pic3.jpg" title="Wallpaper" /> </gallery> |
可以定义一个热点或layer的样式，如上，然后通过galleryname属性打开对应的相册，也可以直接用show_gallery(gallery1)的动作形式直接打开，gallery1是相册name.
如果在移动设备打开时横向情况下，需要相册自适应的话，可以加入以下代码：
|
1 |
<events onresize="make_gallery(get(activeGallery));" > |
样例
下载地址
微信扫码关注“域图新视界”公众号，编辑发送“移动相册”，免费下载文件。
![krpano实现转到特定角度出现图片案例[非会员文章]](https://victu360.com/wp-content/themes/vfilmtime/timthumb.php?src=http://victu360.com/ad/autoang.gif&h=280&w=506&zc=1)
