# Horizontal image gallery issue

**URL:** https://forum.kirupa.com/t/horizontal-image-gallery-issue/309531
**Category:** Uncategorized
**Created:** [May 17, 2010, 9:28pm UTC](https://forum.kirupa.com/t/horizontal-image-gallery-issue/309531 "2010-05-17T21:28:22Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![namelesspace](https://avatars.discourse-cdn.com/v4/letter/n/f4b2a3/32.png) [@namelesspace](https://forum.kirupa.com/u/namelesspace)
#### Post date: [May 17, 2010, 9:28pm UTC](https://forum.kirupa.com/t/horizontal-image-gallery-issue/309531/1 "2010-05-17T21:28:22Z")

</div>

hi, i have an horizontal image gallery (you can view on [www.namelesspace.com/decorom/](http://www.namelesspace.com/decorom/)).

my problem is that it works great when all the images are the same width…when i have different widths to the images the gaps between then are uneven…

i would appreciate if someone can tell me what i did wrong ?!

thanks and here is the script:

[as]  
//SCRIPTS  
num = 1;  
total = 0;  
rot = 0.5001_Math.PI;  
sliding = false;  
rotGoto = rot;  
thumbrowXgoto = 0  
rotTweening = rot;  
rotImageNumber = 0;  
overNumber = “”;  
tooltip.\_alpha = 0;  
//import libs  
import mx.transitions.Tween;  
import mx.transitions.easing._;  
import flash.display.BitmapData;  
intThumb.\_visible = true;  
tooltip.field.autoSize = true;  
diz = this;  
// xml object / ignorewhite  
xml = new XML();  
xml.ignoreWhite = true;  
//load object for parsing  
xml.onLoad = function(sucess) {  
if (sucess) {  
storeAll(xml);  
}  
};

// load XML  
xml.load(‘lounge\_room.xml’);

// parsing function  
function storeAll(xmlDoc\_xml) {  
//parse settings

```
for (at in xmlDoc_xml.childNodes[0].attributes) {
    diz[at] = int(xmlDoc_xml.childNodes[0].attributes[at]*100)/100;
}

if (useMotionBlur == "1") {
    useMotionBlur = true;
} else {
    useMotionBlur = false;
}
if (useReflection == "1") {
    useReflection = true;
} else {
    useReflection = false;
}
if (useFadeOnMouseOver == "1") {
    useFadeOnMouseOver = true;
} else {
    useFadeOnMouseOver = false;
}

if (useExpandOnMouseOver == "1") {
    useExpandOnMouseOver = true;
} else {
    useExpandOnMouseOver = false;
}
//navbar_bg._y = centerY + spanY +100;
//parse all imgs
for (var n = 0; n&lt;xmlDoc_xml.childNodes[1].childNodes.length; n++) {
    duplicateMovieClip(thumbrow.intThumb,"thumb"+n,thumbrow.getNextHighestDepth());
    thumbRef = thumbrow["thumb"+n];
    thumbRef._visible = true;
    thumbRef.num = n;
    thumbRef.urls = xmlDoc_xml.childNodes[1].childNodes[n].attributes.imageURL;
    thumbRef.linkData = xmlDoc_xml.childNodes[1].childNodes[n].attributes.linkData;
    thumbRef.linkType = xmlDoc_xml.childNodes[1].childNodes[n].attributes.linkType;
    thumbRef.linkTarget = xmlDoc_xml.childNodes[1].childNodes[n].attributes.linkTarget;
    thumbRef.captionText = xmlDoc_xml.childNodes[1].childNodes[n].attributes.captionText;
    loadMovie(thumbRef.urls, thumbRef.loader);
    total += 1;
}
//end for folders
tooltip.swapDepths(3002);

```

}  
//end function  
this.onEnterFrame = function() {  
//move to center

```
_x += ((Stage.width - ((Stage.width-270))/1-_x)-20);
_y += ((Stage.height - (spanY))/2-_y);
//

rowmask._width = (Stage.width-270);
rowmask._height = spanY+2*marginBorder;
rowmask._y = - marginBorder;
smallBackground._width = (Stage.width-270);
smallBackground._height = spanY;
SliderBackground._width = (Stage.width-270)+2*marginBorder;
SliderBackground._height = spanY+2*marginBorder;
SliderBackground._x = - marginBorder;
SliderBackground._y = - marginBorder;
if(orientationType == 0){
    thumbrowXgoto = - (thumbrow._width - (Stage.width-270)) * ((_xmouse-50) / ((Stage.width-270)-100));
}else{
    if(spanX != undefined){
        thumbrowXgoto -= (_xmouse-((Stage.width-270)/2))/(Stage.width-270)*speed*100;
    }
    
}
if(thumbrowXgoto &gt;0){
    thumbrowXgoto = 0;
}
if(thumbrowXgoto &lt; - (thumbrow._width - (Stage.width-270))){
    thumbrowXgoto = - (thumbrow._width - (Stage.width-270));
}
if(sliderType == 0){
    thumbrow._x += (thumbrowXgoto - thumbrow._x) * speed;
}else{
    thumbrow._x = 0;
}
//tooltip
tooltip._alpha += (tooltip.alphaTo-tooltip._alpha)/3;
tooltip.bg._width = tooltip.field._width+5;
tooltip._x = _xmouse+30;
tooltip._y = _ymouse+30;
//blur
thumbrow.filters = "";
if (useMotionBlur) {
    var blur = new flash.filters.BlurFilter(Math.abs(thumbrow._x - prevx)*motionBlurValue, 0, 1);
    var tmpFilters:Array = thumbrow.filters;
    tmpFilters.push(blur);
    thumbrow.filters = tmpFilters;
}
prevx = thumbrow._x;

```

};  
//functions  
function getX(number) {  
ax = thumbrow[“thumb”+(number-1)].\_x + (thumbrow[“thumb”+(number-1)].\_width) + marginX;  
if(number == 0){  
ax = 0;  
}  
return ax;  
}  
function getY(number) {  
//ay = centerY+(1-distanceValue)_spanY_Math.sin(rot+number_perinstance);  
ay = -(((thumbrow[“thumb”+(number)].\_yscale-100)/100)_(spanY/2))

```
return ay;

```

}  
function reflect(src, target, alpha, wi, he) {  
var bdata:BitmapData = new BitmapData(wi/(src.\_xscale/100), he/(src.\_yscale/100), true, 0x00ffffff);  
bdata.draw(src);  
var refmc:MovieClip = target.createEmptyMovieClip(“refmc”, 0);  
refmc.attachBitmap(bdata,0);  
refmc.\_width = wi;  
refmc.\_height = he;  
refmc.\_yscale = -refmc.\_yscale;  
refmc.\_y = he;  
var rmask = target.createEmptyMovieClip(“rmask”, 1);  
var matrix = {matrixType:“box”, x:0, y:0, w:wi, h:he, r:(90/180)\*Math.PI};  
rmask.beginGradientFill(“linear”,[0xffffff, 0xffffff],[alpha, 0],[0, 100],matrix,“pad”);  
rmask.moveTo(0,0);  
rmask.lineTo(0,he);  
rmask.lineTo(wi,he);  
rmask.lineTo(wi,0);  
rmask.lineTo(0,0);  
rmask.endFill();  
refmc.cacheAsBitmap = true;  
rmask.cacheAsBitmap = true;  
refmc.setMask(rmask);  
}  
[/as]
