Dynamically mess images inside a container

Well, i'm starting a function to 'mess' with a image gallery, i made an example

i wanna know if the way i'm doing is realy the BEST way, the function work perfect, but i fill that can be better, something more dynamic, like never flow over the edge, and mess with the number of images that user places inside the gallery, now i set as index 0 to 5.

Is there any easy way to improve this little function, make the code faster/smaller then that?

Any tips, be my guest.

jQuery

```
$("#ran").click(function () {
mess(1, $(".holder img"));
});

function mess(type, gallery) {
var getNumImg = gallery.length,
winWidht = $("#galeria").width(),
winheight = $("#galeria").height(),
imgHeight = $("#content-wrapper img").height(),
ftBottom = winheight - ($(".stats").height() + imgHeight + 150);

$(".holder").width(winWidht / 2);

gallery.each(function (index) {
var randonLeft, randonRight, randonTop, randonTransform, maxIndex;
var leftFt, topFt, transFt;
var sign = "- ";
var signRes = sign.charAt(Math.floor(Math.random() * sign.length));

if (type == 1) {
if (index == 0) {
maxIndex = getNumImg;
transFt = {
"from": 1,
"to": 30
}
topFt = {
"from": 1,
"to": ftBottom
}
} else if (index == 1) {
leftFt = {
"from": 30,
"to": 40
}
transFt = {
"from": 1,
"to": 30
}
topFt = {
"from": 1,
"to": ftBottom
}
} else if (index == 2) {
leftFt = {
"from": -30,
"to": -40
}
transFt = {
"from": 1,

I think your code is good and more importantly it works. The main thing I would change is that huge if else statement. You repeat yourself a lot there. Here's another way you could do it:

Also here's your edited fiddle.

Acho que o seu trabalho está bom e mais importante ele funciona. A parte que chama minha atenção é o if/else enorme. Você se repete muito ali. Outra forma que você pode fazer é assim:

if(type === 1){
    //You had these every time, so you can declare them once here.
    //Você declara isso em todos os casos, mas só precisa fazer uma vez aqui.
    topFt = { "from" : 1, "to" : ftBottom };
    transFt  = { "from" : 1,  "to" : 30 };

    //I Took out all the repetitions and left the cases where we actually change something.
    //Tirei todos os casos em que você estava se repetindo e deixei somente os que realmente estão mudando algo.
    switch(index){ 
        case 0:
            maxIndex = getNumImg;
            break;
        case 1:
            leftFt   = { "from" : 30, "to" : 40 }
            break;
        case 2: //If index === 2
        case 3: //OR if index === 3
            leftFt   = { "from" : -30,  "to" : -40 }
            break;
        case 5:
            leftFt   = { "from" : 40,  "to" : 50 }
            break;
        //Add more cases if you want/need to.
        //Adicione mais casos aqui se precisar.
        default:
            break;
    }
}

StackExchange Code Review Q#23619, answer score: 2