previous exampleHomeDownload
next example

Ajax Zoom - inLine implementation

With the method jQuery.fn.axZm.zoomSwitch() it is possible to switch to a different picture from outside of ajax zoom:

Example with picture thumbs:

  

Switch to next, prev image with the method jQuery.fn.axZm.zoomPrevNext()

External controls example: zoomIn | zoomOut | reset

Head PHP:

			if(!session_id()){session_start();}
			unset ($_SESSION['imageZoom']);
			$_SESSION['imageZoom']=array();
			
			$_GET['example'] = 9;
			
			if (!isset($_GET['zoomDir'])){
				$_GET['zoomDir'] = 'fashion';
				$_GET['zoomID'] = 8;
			}
			
			// Contains all needed classes and other files
			require ("../axZm/zoomInc.inc.php");
			
			// Returns AJAX-ZOOM CSS files
			echo $axZmH->drawZoomStyle($zoom);
			
			// Returns AJAX-ZOOM javascript files 
			echo $axZmH->drawZoomJs($zoom, $exclude = array());
			
		

Body PHP:

			echo "<DIV id='zoomInlineContent' style='float: left; margin: 0px 10px 10px 0px;'>";
			
			// Returns all needed HTML for AJAX-ZOOM. It is visible in the source code of a page.
			echo $axZmH->drawZoomBox($zoom, $zoomTmp);
			
			// Returns the configuration parameters
			echo $axZmH->drawZoomJsConf($zoom, $rn = false, $pack = true);
			
			// Returns the init function
			echo $axZmH->drawZoomJsLoad($zoom, $pack = true, $windowLoad = true);
			echo "</DIV>";
			
			// Draw the thumbs
			foreach ($zoom['config']['pic_list_array']as $k=>$v){
				echo "<a href=\"#\" onClick=\"jQuery.fn.axZm.zoomSwitch('$k'); return false;\">
				<img src='".$axZmH->composeFileName($zoom['config']['gallery'].$v, 
				$zoom['config']['galleryFullPicDim'],'_')."' border='0' class='outerimg'></a>";
			}		
			
			// Draw prev, next links
			echo "<input type='button' value='<<' onClick=\"jQuery.fn.axZm.zoomPrevNext('prev')\">&nbsp;&nbsp;";
			echo "<input type='button' value='>>' onClick=\"jQuery.fn.axZm.zoomPrevNext('next')\">";
			
		

Modules & Plugins Ecommerce

Magento 360 spin & zoom See AJAX-ZOOM in action on Magento
Integration quide
XT:commerce 360 spin & zoom See AJAX-ZOOM in action on xt:Commerce (xtcModified, Gambio, VEYTON 4)
Integration quide
Oxid product zoom See AJAX-ZOOM in action on Oxid eSales
Integration quide
hybris zoom 360 spin See AJAX-ZOOM in action on hybris multichannel commerce (no php)
  More coming soon...
6.0+ 2.0+ 2.0+ 1.0+ 9.5+ 2.0+ 4.0+ Pinch zoom, tap zoom,
swipe

Comments (0)

Leave a Comment

Name (required):
Email (required):
Website:
Your comment (no html):
Looking for a place to add a personal image? Visit www.gravatar.com to get Your own gravatar, a globally-recognized avatar. After you're all setup, Your personal image will be attached every time you comment.
MORE EXAMPLES
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom
javascript picture zoom