jquery ui と js を使用して、スライダーで必要なものをズームします。
refreshZoom = function()
{
var epicContainer = $('#epic_container');
storyMap.zoomfactor = $( "#bit-zoom-slider" ).slider( "value" ) / 100;
epicContainer.css({'-moz-transform': 'scale(' + storyMap.zoomfactor + ',' + storyMap.zoomfactor + ')', 'zoom': storyMap.zoomfactor,'-webkit-transform': 'scale(' + storyMap.zoomfactor + ')'});
var newWidth = storyMap.origWidth * storyMap.zoomfactor ;
var newHeigth = storyMap.origHeight * storyMap.zoomfactor ;
$('#bit-scrollbar-helper').css({ 'width': newWidth + 'px'});
};
$('#zoom-slider').slider({
orientation: "horizontal",
range: "min",
max: 150,
min: 25,
value: 100,
slide: function(){refreshZoom()},
change: function(){refreshZoom()}
});