Site manager: Content Management > Site Design > Custom Photo gallery Information

Photo Gallery With 3600

Label Input
JS File Path /DMSLiveCafe/3/customphotogallery/360degree/js/jquery.movingboxes.js
CSS File Path /DMSLiveCafe/3/customphotogallery/360degree/css/movingboxes.css
Open Tags <div class="wrapper"><ul id="slider-one">
Item Template(Token) <li><img alt="" src="$ImageUrl$"></li>
Close Tags </ul></div>
JS to Initialize
jQuery(document).ready(function ($) {
var $outer = $('#mb-controls');
var $inner = $outer.children(':first');
var finalW = $inner.find('img').length * 115;
$inner.css({width:finalW + 'px',display:'block'});
var extra = 800;
//Get menu width
var divWidth = $outer.width();
//Remove scrollbars
$outer.css({
overflow: 'hidden'
});
//Find last image in container
var lastElem = $inner.find('a img:last');
$outer.scrollLeft(0);
//When user move mouse over menu
$outer.unbind('mousemove').bind('mousemove',function(e){
// alert('hi');
var containerWidth = lastElem[0].offsetLeft + lastElem.outerWidth() + 2*extra;
var left = (e.pageX - $outer.offset().left) * (containerWidth-divWidth) / divWidth - extra;
$outer.scrollLeft(left);
});
});
NOTE: Ideal dimensions for images is 640px * 480px