Я хочу, чтобы мои изображения были в центре, кто-нибудь знает, как установить динамическое смещение в ползунке Coda?Панель классов div - это только ширина изображения, так что между изображениями есть только 9 пикселей
var scrollOptions = {
target: $scroll, // the element that has the overflow
items: $panels,
navigation: '.navigation a',
prev: 'img.left',
next: 'img.right',
axis: 'xy',
onAfter: trigger,
// do i need a dynamic offset to center my images?
// each image has different width
// and the div class panel is only width of the image
offset: offset,
duration: 500,
easing: 'swing'
};
<div id="slider">
<div class="scroll">
<div class="scrollContainer">
<div class="panel" id="image1"><img src="data/8f8bc5cb2fdac666c9534f7c4b78c010.jpg" alt="" /></div>
<div class="panel" id="image2"><img src="data/31f3ae0aac735d2b9432e88108e75b86.jpg" alt="" /></div>
<div class="panel" id="image3"><img src="data/42a4c582d65e46dda4ddcde70a5b2afc.jpg" alt="" /></div>
<div class="panel" id="image4"><img src="data/30c32091eb1121f630c48016b04a6f04.jpg" alt="" /></div>
</div>
</div>
<div class="scroll-bar"></div>
<div class="photo-thumb-block">
<div class="photo-thumb"><a href="#image1"><img src="small/8f8bc5cb2fdac666c9534f7c4b78c010.jpg" style="width:159px;height:119px;" alt="" /></a></div>
<div class="photo-thumb"><a href="#image2"><img src="small/31f3ae0aac735d2b9432e88108e75b86.jpg" style="width:159px;height:119px;" alt="" /></a></div>
<div class="photo-thumb"><a href="#image3"><img src="small/42a4c582d65e46dda4ddcde70a5b2afc.jpg" style="width:159px;height:119px;" alt="" /></a></div>
<div class="photo-thumb last"><a href="#image4"><img src="small/30c32091eb1121f630c48016b04a6f04.jpg" style="width:159px;height:119px;" alt="" /></a></div>
</div>
</div>
, см. здесь http://tradinx.com/codatest/
спасибо за помощь