Как я могу сказать «если ширина> высота», то «сделать это» с jQuery?

Question

У меня есть несколько элементов.Количество их на странице постоянно меняется, имейте это в виду.

Элемент называется .portalimg .Мне нужно сказать, если width > height, установите width на 125 пикселей.Если height > width, установите height на 125px.

Вот что у меня есть:

$('.portalimg').each(function() {
  var pimgw = $(this).width();
    var pimgh = $(this).height();
    if (pimgw > pimgh) {
        $(this).css('width','125px')
    } else {
        $(this).css('height','125px')
    }
});

РЕДАКТИРОВАТЬ: предупреждает об успехе, но не применяет width & height.Где я ошибся?

РЕДАКТИРОВАТЬ 2: Обновлен код с чистым снизу.Это по-прежнему только ограничивает свойство высоты, даже если изображения выше, тогда оно широко.Взгляните:

http://jacksongariety.com/gundoglabs/

РЕДАКТИРОВАТЬ 3: Проблема в том, что все они возвращают 0. Если у меня есть предупреждение, произнесите значение pimgw или pimgh, это всегда 0.

РЕДАКТИРОВАТЬ 4: Наконец-то получен самый лучший и самый чистый код, возможный с кэшированием, и он всегда будет загружаться правильно, даже если он рисует изображения из кэша:

$(function(){
    $('.portalimg').ready(function(){
        $('.portalimg').fadeTo(0,1).each(function(index) {
            var a = $(this);
            if (img.width() > a.height()) {
                a.css('width','135px')
            } else {
                a.css('height','125px')
            }
        });
    });
});

Answer 1

$('.portalimg').each(function() {
  var pimgw = $(this).width();
    var pimgh = $(this).height();
    if (pimgw > pimgh) {
        $(this).css('width','125px')
    } else {
        $(this).css('height','125px')
    }
});

Answer 2

Если существует несколько элементов класса portalimg, вы можете просто использовать итератор .each: http://api.jquery.com/each/

$(function() {
    $('.portalimg').each(function(index) {
        var img = $(this);
        if (img.width() > img.height()) {
            img.css('width','125px')
        } else {
            img.css('height','125px')
        }
    });
}

Answer 3

Как насчет этого:

$('.portalimg').each(function() {
    (($(this).width() > $(this).height())
    && ($(this).css('width','125px')) )
    || ($(this).css('height','125px'))
});

http://jsfiddle.net/DerekL/Qx4jF/

Answer 4

$('.portalimg').each(function() { var
    img = $(this),
    w = img.width(),
    h = img.height(),
    toModify = w > h ? 'width' : 'height';
    img.css(toModify, '125px');
}

Answer 5

Могу попробовать это. Другие ответы отлично подходят для. Вы ошиблись с синтаксисом for и body. Вы имели в виду #body или .body?

$(".portalimg").each(function(){ 

    var pimgw = $(this).width(),
        pimgh = $(this).height();

    if (pimgw > pimgh) {
        $(this).css('width','125px')
    }else{
        $(this).css('height','125px')
    }
});

Answer 6

Ваш цикл неправильный, вы должны использовать

pimg = $('.portalimg').each( function() {;
    alert("success")
    var pimgw = $(this).width();
    var pimgh = $(this).height();
    if (pimgw > pimgh) { 
        $(this).css('width','125px')
    } else {
        $(this).css('height','125px')
    }
});

Это вызов функции для всех объектов поиска с классом .portalimg в вашем документе.