Оптимизация кода
Есть код простенькой галереи изображений написанный мной. И вроде все работает, но меня не покидает ощущение, что это говнокод и мне нужно руки оторвать.
Вопрос, как его оптимизировать, как убрать глобальную переменную, и вообще как надо. Заранее спасибо) http://мкв-иркутск.рф/test.php html: <body > <div id="wrupper" > <div class="container"> <img class="gl_back" src="image/gl_back.png" /> <img class="gl_next" src="image/gl_next.png" /> <div class="gallery"><img src="" /></div> <div class="gallery"><img src="" /></div> <div class="gallery"><img src="" /></div> <div class="gallery"><img src="" /></div> </div> </div> </body> JS:
var galleryArray = [
"image/test/test_01.png",
"image/test/test_02.png",
"image/test/test_03.png",
"image/test/test_04.png",
"image/test/test_05.png",
"image/test/test_06.png",
"image/test/test_07.png",
"image/test/test_08.png",
"image/test/test_09.png",
"image/test/test_10.png",
];
var counter = 0; // стчетчик изображений
$(function(){
setImage($('.gallery img'), galleryArray);
$('.gl_next').bind('click', function(){nextImage($('.gallery img'), galleryArray)});
$('.gl_back').bind('click', function(){backImage($('.gallery img'), galleryArray)});
});
function setImage(elemArray, array) {
var i, len;
for (i = 0, len = elemArray.length; i < len; i++){
elemArray[i].src = array[i]
};
};
function nextImage(elemArray, array) {
var len1 = elemArray.length;
var len2 = array.length - 1;
var i = counter;
if (counter >= len2) counter = 0;
else counter++;
for (var j = 0; j < elemArray.length; j++){
if (i >= len2) i = 0
else i++;
elemArray[j].src = array[i]
};
};
function backImage(elemArray, array) {
var len1 = elemArray.length;
var len2 = array.length - 1;
if (counter <= 0) counter = len2;
else counter--;
var i = counter;
for (var j = 0; j < elemArray.length; j++){
elemArray[j].src = array[i]
if (i >= len2) i = 0
else i++;
};
};
|
А зачем len1 объявляешь?
Не используешь же ни где. Ну и вместо глобальной переменной можно замыкание использовать. Не знаю только, нужно ли :) |
Darth_Danius,
http://javascript.ru/forum/showthrea...600#post383965 |
Может как-то так?
var galleryArray = [
"image/test/test_01.png",
"image/test/test_02.png",
"image/test/test_03.png",
"image/test/test_04.png",
"image/test/test_05.png",
"image/test/test_06.png",
"image/test/test_07.png",
"image/test/test_08.png",
"image/test/test_09.png",
"image/test/test_10.png",
];
$(function(){
var position = counter(); // используем замыкание
setImage($('.gallery img'), galleryArray);
$('.gl_next').bind('click', function(){nextImage($('.gallery img'), galleryArray, position(1))});
$('.gl_back').bind('click', function(){nextImage($('.gallery img'), galleryArray, position(-1))});
});
function counter () { // функция, возвращающая текущую позицию первого показываемого элемента
var len = galleryArray.length;
var count = 0; // текущая позиция первого показываемого элемента
return function (direction) { // direction - направление перелистывания (1 вперёд : -1 назад)
if (count + direction < len) {
(count + direction > 0) ? count = count + direction: count = len - 1;
// если не понятна сокращённая запись, вот полная:
// if (count + direction > 0) {
// count = count + direction;
// } else {
// count = len - 1; //последний элемент массива galleryArray
// }
} else {
count = 0;
}
return count;
}
}
function setImage(elemArray, array) {
var i, len;
for (i = 0, len = elemArray.length; i < len; i++){
elemArray[i].src = array[i]
};
};
function nextImage(elemArray, array, counter) {
var lastElement = galleryArray.length - 1;
var i = counter;
for (var j = 0; j < elemArray.length; j++){
elemArray[j].src = array[i]
(i < lastElement) ? i++ : i = 0;
};
};
|
Спасибо, так лучше!
|
| Часовой пояс GMT +3, время: 05:24. |