boon.js

$('document').ready(function() {
	 
	var $img = $('img');  // Cache the image. Better for performance.

	$img.draggable();


	$img.css({
		left: ($(document).width() / 2) - ($img.width() / 2),
		top: ($(document).height() / 2) - ($img.height() / 2)
	});

	// $(document).mousewheel(function(event, delta) {
	// 	console.log(delta);
	// 	console.log(event);
	// });
	  	  
	$(document).mousewheel(function(event, delta) {

		var offset = $img.offset();  // Get current offset of container
		
		var calcX = event.pageX - $(window).scrollLeft();
		var calcY = event.pageY - $(window).scrollTop();
		
		var width = $img.width();
		var height = $img.height();
			
		var newWidth, newHeight;
		
		if (delta > 0) {
				
			newWidth = width*1.25;
			newHeight = height*1.25;
			
		} else if (delta < 0) {
		
			newWidth = width*0.8;
			newHeight = height*0.8;

		}
			
		var diffWidth = newWidth - width;
		var diffHeight = newHeight - height;

		var leftPercent = (calcX - offset.left) / width;
		var topPercent = (calcY - offset.top) / height;
	
		$img.offset({top: offset.top - (diffHeight * topPercent), left: offset.left - (diffWidth * leftPercent)});
		
		$img.width(newWidth).height(newHeight);
		
		return false;
	});
});