0

一度に 2 つのアイテムを表示するこのギャラリーがありますが、ギャラリー内のアイテム B に対して同じコードを常に繰り返すよりもエレガントな方法があるかどうか疑問に思っていました。

メインコードは次のとおりです。

var Gallery = new Object();
    window.onload = function(){
Gallery.Images = ['red','blue','pink','green','yellow','purple','orange','navy'];
Gallery.CurrentIndexA = 0;
    Gallery.CurrentIndexB = 1;
 };

Gallery.Next = function(){
if (Gallery.CurrentIndexA < (Gallery.Images.length-1)){ 
    Gallery.CurrentIndexA++;
    Gallery.CurrentIndexB++;
    console.log("A is:" + Gallery.CurrentIndexA);
    console.log("B is:" + Gallery.CurrentIndexB);
} 
else {
    Gallery.CurrentIndexA = 0;
}
Gallery.Display();
};

Gallery.Prev = function(){
if (Gallery.CurrentIndexA > 0){
    Gallery.CurrentIndexA--;
    Gallery.CurrentIndexB--;
    console.log("A is:" + Gallery.CurrentIndexA);
    console.log("B is:" + Gallery.CurrentIndexB);
}
else {
    Gallery.CurrentIndexA = (Gallery.Images.length-1); 
}
Gallery.Display();
};

Gallery.Display = function(){
var photoA = document.getElementById('photoA');
var photoB = document.getElementById('photoB');
var currentImageA = Gallery.Images[Gallery.CurrentIndexA];
var currentImageB = Gallery.Images[Gallery.CurrentIndexB];
photoA.className = currentImageA;
photoB.className = currentImageB;
};

ここにフィドルがあります：http://jsfiddle.net/2AdA9/1/

どうもありがとう！

4

1 に答える 1

0

見栄えを良くしたい場合は、次のようなことができます。

Gallery.moveUp = function (){
    Gallery.CurrentIndexA += 1;
    Gallery.CurrentIndexB += 1;
};

Gallery.moveDown = function (){
    Gallery.CurrentIndexA -= 1;
    Gallery.CurrentIndexB -= 1;
};

次に、上に移動したり、後ろに移動したいときに、これらの関数を呼び出すだけです。

于 2013-10-30T13:16:22.947 に答える