Подогнать все изображения с пропуском в делении

Question

Подогнать все изображения с пропуском в делении

0

Мои уменьшенные изображения в настоящее время имеют размер 240 на 125, поэтому он не имеет надлежащего размера, чтобы все они соответствовали горизонтали в div.

Как я могу заставить их отображаться горизонтально в сетке? Кроме того, как мне получить изображения с размерами, чтобы иметь одинаковое соотношение сторон и промежуток 15 пикселей между ними?

Мой CSS

#full { height:400px; background:#FAFAFA;}
#thumbs { height:150px; background:#E7E7E7; }
#thumbs img { float:left; margin:0 15px; }

Вот мой jQuery

$(document).ready(function() {
    $('#thumbs > img').width($('#thumbs').width()/$('#thumbs > img').length-15);
});

dexlucas 01 дек. 2013, в 12:55

Источник

Теги:

javascript

jquery

html

css

1 ответ

Ещё вопросы

Mark S · Answer 1 · 2013-12-01T09-50-00.000Z

Вы сказали, что хотите промежуток в 15px между img но вы устанавливаете margin:0 15px, что означает, что слева и справа 15px, поэтому промежуток между ними составляет 30px, то есть проблема. Вы должны установить только один боковой margin-left:15px.

попробуй это:

$(document).ready(function() {
    var $img = $('#thumbs > img'),
        len = $img.length,
        gap = $img.css('margin-left').replace('px',''),//15
        divW = $('#thumbs').width()-gap;

    $img.width(divW/len-gap);
});

Я изменил это, но не работает. Один img до сих пор не подходит.
Хорошо, в твоих вычислениях есть недостающие фрагменты. Я обновил ответ.