• HOME
  • showcase
  • Documentation
    • Codegenerator
    • Code Examples
      • Multiple 360 images
      • infinite-loop
    • Integration
      • Wordpress
      • Joomla
    • API Document
    • Enable Cloudzoom
    • How to create images
    • Features in action
  • Download
    • Free version
    • No creditsign
    • Releases
  • Installation service
  • Contact
    • Contact
    • Twitter
    • Partners

Enable zoom – CloudZoom

Share
If you want to use a zoom function in combination with our viewer we recommend to try Cloudzoom. It’s a JQuery plugin and with a few modifications it works very well.

Use the zoom function with the loader – Beginners

First go to the website and view the options.
We created a version that has no conflicts with other library’s like mootools or prototype. We assign jQuery to a new variable called CZjQuery. We have made some modifications to the script and we added a click event to our viewer (don’t worry it’s already in the loader). Now you can rotate and zoom your 360 presentation.
<!--Paste this script somewhere in your website code-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $.noConflict();
  CZjQuery=jQuery;
  // assign jQuery to neural library
</script>
<<link rel="stylesheet" href="http://www.360-javascriptviewer.com/release/latest/css/cloud-zoom.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://www.360-javascriptviewer.com/release/latest/js/cloud-zoom-no-conflict.js"></script>

Let the loader know you want to zoom

When you call the loader give the parameter ‘zoom : true’ as shown in the example here.
<script type="text/javascript">
    mloaderx = new loader(
{
tag:'javascriptviewer',
frames:36,
zoom:true //set to true to use the zoomfunction
});
</script>
Download the modified version of Cloudzooom. cloud-zoom-for-360-javascriptviewer.js
Share

Learning Centre

  • Implementation guide
  • Cloudzoom
  • How to create images
  • Features in action

Put it on your own domain

  • No credit sign
  • Change images/ css
  • Script on your server
  • Unlimited number of presentations on a domain
  • support and updates