SCROLL PAGE
DescriptionÂ
Subheading
Scroll Page
Description here possibly and if do it's going to be a rather few lines of some of this and that. Description here possibly and if do it's going to be a rather few lines of some of this and that. Description here possibly and if do it's going to be a rather few lines of some of this and that. Description here possibly and if do it's going to be a rather few lines of some of this and that. Description here possibly and if do it's going to be a rather few lines of some of this and that. Description here possibly and if do it's going to be a rather few lines of some of this and that.
Gallery
ZLVideo
Embed Code
<div class="container">
<h2>Animation</h2>
<div id="zoom1" style="width:100%; height:500px;"></div>
</div>
<div class="container">
<h2>Gallery</h2>
<div id="zoom2" style="width:100%; height:500px;"></div>
</div>
<div class="container">
<h2>ZLVideo</h2>
<div id="zoom3" style="width:100%; height:500px;"></div>
</div>
<script src="/zoomlook/assets/ZLWebGL.js"></script>
<script src="/zoomlook/assets/ZLPlayer.min.js"></script>
<script>
window.onload = () => {
const ZL1 = new ZLPlayer({
basePath: "/zoomlook/pix/ZLGLAnimation/",
clickLoad: true,
type: "animation",
fullscreenMode: 'page',
fps: 8,
pageScroll: {
enabled: true,
invert: false,
touch:true
}
});
ZL1.loadZLView("LOOK03", "zoom1");
const ZL2 = new ZLPlayer();
const config = {
showThumb: "all",
pageScroll: {
enabled: true,
invert: false,
touch:true
}
};
const configList = [
{
basePath: "/zoomlook/pix/ZLGLAnimation/",
type: "animation",
fps: 8,
uuid: "LOOK06",
},
{
basePath: "/zoomlook/pix/ZLGLVideo/",
type: "ZLVideo",
inertia: true,
fps: 24,
uuid: "ZLV-LOOK07",
},
{
basePath: "/zoomlook/pix/ZLGLGallery/",
type: "photo",
uuid: "LOOK01",
},
{
basePath: "/zoomlook/pix/ZLGLGallery/",
type: "photo",
uuid: "LOOK02",
},
{
basePath: "/zoomlook/pix/ZLGLGallery/",
type: "photo",
uuid: "LOOK03",
},
{
basePath: "/zoomlook/pix/ZLGLGallery/",
type: "photo",
uuid: "LOOK04",
},
];
ZL2.loadZLGallery(config, "zoom2", configList);;
const ZL3 = new ZLPlayer({
basePath: "/zoomlook/pix/ZLGLVideo/",
clickLoad: false,
type: "ZLVideo",
fullscreenMode: 'page',
bounce: true,
spinReverse: true,
fps: 30,
pageScroll: {
enabled: true,
invert: false,
touch:true
}
});
ZL3.loadZLView("ZLV-LOOK07", "zoom3");
};
</script>