Функция обратного вызова JQuery не работает

Question

Функция обратного вызова JQuery не работает

0

Я пытаюсь использовать функцию обратного вызова следующего типа:

$('elem').attr(
'attr',
function(i, val){
    return i*10 + 'px';
   }
);

для размещения изображений один поверх другого.

Мой HTML включает только пять изображений.

CSS:

img {
position: absolute;
width: 100px;
height: auto;
}

JQuery:

$('img').attr(
'top',
function(i, val){
    alert(50 + i*110 + 'px');
    return 50 + i*(110) + 'px';
  }
);

Оповещения на странице: 50px... 160px... 270px... 380px... 490px Но изображения все еще застревают в одном месте. Вы можете найти здесь ошибку?

dddkk 12 июль 2014, в 10:48

Источник

Теги:

javascript

jquery

html5

css3

jquery-callback

1 ответ

Ещё вопросы

blgt · Accepted Answer · 2014-07-12T06-31-00.000Z

Что вы делаете, это установить свойство HTML, а не свойство CSS. Вы получаете изображение <img top=50px></img>, которое в браузере ничего не значит. Используйте функцию jquery .css() для управления css:

$('img').css(
    'top',
    function(i, val){
        return 50 + i*(110) + 'px';
    }
);

Например. http://jsfiddle.net/M6SZE/