example15_gallery_clean.php HOME Examples overview Download Ask a question / privacy policy / imprint

AJAX-ZOOM 360/3D responsive example, no PHP code in this file. Integration can be done on the template level.

Switch to a different 360 with the $.fn.axZm.loadAjaxSet API


You can easily load a different 360-degree product view into the same instance of the viewer by using the AJAX-ZOOM $.fn.axZm.loadAjaxSet API method. This method does not keep the frame number or zoom level. If you would like to maintain the above, see example36.

Resize with JS / CSS

The buttons right to the viewer demonstrate how to resize the parent container via JavaScript so that the viewer adjusts its size too. When the window size changes, the size of the viewer adjusts automatically, so you do not have to take any actions in that case. However, if you resize the AJAX-ZOOM parent container via JavaScript, e.g., by a click on a button, that is modifying the style attribute directly or removing or adding a different CSS class, then you should execute the jQuery.fn.axZm.resizeStart(3000); API method when the container starts resizing and execute the jQuery.fn.axZm.resizeStart(1); after the resizing action definitely ends.

UI buttons

Please note that among many, many other settings and design restyles you can also this black tollbar under the player and a different one if you want.