только первый элемент в jquery каждый цикл обновляется

Question

только первый элемент в jquery каждый цикл обновляется

0

Привет, я просто пытаюсь сделать каждый цикл над элементами, содержащими фронт класса, но только первый элемент обновляется по какой-либо причине, пожалуйста, помогите. Может быть, это глупая ошибка, но я не могу ее найти.

jsfiddle:

http://jsfiddle.net/sVTCK/7/

HTML:

<div class="wrapper">
    <div class="front"></div>
    <div class="front"></div>
    <div class="front"></div>
    <div class="front"></div>
    <div class="front"></div>
    <div class="front"></div>
</div>

JQuery:

function setSlide(rows, dimension) {
    var topPos = 0;
    var leftPos = 0;
    $(".front").each(function(i, e) {
        topPos++;
        if (i % rows === 0) {
            topPos = 0;
            leftPos++;
        }
        var position = topPos * dimension + " " + (leftPos - 1) * dimension;
        e.style.backgroundPosition = position;  
        e.innerHTML =  e.style.backgroundPosition;
    });
}
setSlide(3,200);

CSS:

.front{
    width:200px;
    height:200px;    
    background:url(some image);
    border:1px solid black;
    float:left
}

.wrapper{
    overflow:hidden;
    width:610px;    
}

Susheel Singh 29 март 2014, в 13:17

Источник

0

Вы хотите добавить только размер в квадратах?
user3401335 29 март 2014, в 11:57
0

Это было бы изображение в конечном продукте
Susheel Singh 29 март 2014, в 12:09

Теги:

javascript

jquery

2 ответа

1

ok Я преувеличил javascript stlightly в jquery, так как вы его использовали и перешел с javascript ванили:

function setSlide(rows, dimension) {
    var topPos = 0;
    var leftPos = 0;
    var front = $('.front');
    $.each(front, function(index, val) {
        topPos++;
        if (index % rows === 0) {
            topPos = 0;
            leftPos++;
        }
        var position = topPos * dimension + "px, " + (leftPos - 1) * dimension + 'px';
        $(this).css('backgroundPosition', position);
        $(this).append(position);
    });
}
setSlide(3,200);

http://jsfiddle.net/sVTCK/18/

Если вы можете сказать нам, что вы пытаетесь сделать с помощью оператора if, это поможет добавить фоновую позицию... Вы должны быть в курсе jQuery, если у вас есть это на странице, так как это будет быстрее, и вы также должны кэшировать ваши переменные

vimes1984 29 март 2014, в 10:11

0

Вы неправы. видеть, проверять элемент, только первый элемент обновляется. Выше ответ правильный. Я забыл "px"
Susheel Singh 29 март 2014, в 12:14
0

прочитайте, что я сказал .... Я упомянул заявление if и исходную позицию. Это также довольно раздражительно с вашей стороны, просто чтобы взять на себя чьи-то усилия и затраченное время. Старайтесь быть немного скромнее, когда просите о помощи
vimes1984 29 март 2014, в 12:18

Ещё вопросы

Вы хотите добавить только размер в квадратах?
Это было бы изображение в конечном продукте
Вы неправы. видеть, проверять элемент, только первый элемент обновляется. Выше ответ правильный. Я забыл "px"
прочитайте, что я сказал .... Я упомянул заявление if и исходную позицию. Это также довольно раздражительно с вашей стороны, просто чтобы взять на себя чьи-то усилия и затраченное время. Старайтесь быть немного скромнее, когда просите о помощи

xdazz · Accepted Answer · 2014-03-29T09-57-00.000Z

function setSlide(rows, dimension) {
    var topPos = 0;
    var leftPos = 0;
    $(".front").each(function(i, e) {
        topPos++;
        if (i % rows === 0) {
            topPos = 0;
            leftPos++;
        }
        var position = topPos * dimension + 'px ' + (leftPos - 1) * dimension +'px';
        e.style.backgroundPosition = position;  
        e.innerHTML =  e.style.backgroundPosition;
    });
}
setSlide(3,200);

РАБОЧАЯ ДЕМО.

Чтобы объяснить, позиции (и длины в целом) нужны единицы. Если только они не равны нулю, вот почему ваш первый элемент работал.
: O блин как и ожидалось глупая ошибка :) спасибо за ответ.