previous exampleHome
next example

Ajax Zoom - inLine implementation

With the method jQuery.fn.axZm.zoomSwitch() it is posiible 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')\">";
			
		
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
javascript picture zoom