This is a 360 object spin example of an animation where, unlike for the other 360 view examples, the horizontal gallery is not disabled.
Ordinarily, the gallery would show thumbnails of all 360 frames, what in most cases does not make any sense.
However, with the
zoomCueFrames parameter that is a filter setting in this 360 view,
the gallery contains only a few selected thumbnails.
When the user clicks on a thumbnail, the animation spins to this particular frame.
This particular 360 view is especially interesting because the 360 photographer uses a filmmaking technique for a flying camera effect rather than a regular 360-degree photography for a watch. Using appropriate equipment or putting many efforts into 360-degree photography, this type of animations is possible and indeed lovely looking for any other kind of a product.
Also in this example, we use the
$.axZmEmbedResponsive plugin to define the aspect ratio for the parent container of the viewer.
The plugin prevents that the viewer is taller than the inner height of the browser window.
It reduces the height of the parent container if it does not fit into the viewport and keeps the aspect ratio if it does.
In example35.php, you can create a similar gallery but with much more options such as defining the zoom level and coordinates for each frame, instant generation of the thumbnails and adding descriptions for each cropped thumbnail gallery image.
<!-- Responsive wrapper which uses embed-responsive Bootstrap CSS class --> <div id="ajaxZoomContainerParent" class="az_embed-responsive"> <!-- Div where AJAX-ZOOM is loaded into --> <div id="azParentContainer" class="az_embed-responsive-item"> Loading, please wait... </div> </div> <!-- When spinSlider is enabled you can put it outside of the player in a container (spinSliderParent opntion) --> <div id="axZm_spinSliderParent"></div>