Получить каждую высоту и центрировать каждый div

#jquery #slider

#jquery #ползунок

Вопрос:

Я использую слайдер jQuery (slider pro), и я хочу центрировать (по горизонтали и вертикали) div текста внутри моих разных слайдов. Каждый div текста имеет разную высоту. К сожалению, с функцией, которую я написал. Он берет высоту первого div текста и применяет ее к другому div.

 <div class="sp-slide">
    <div class="sp-text">
        This is the text that I want to center
    </div>
</div>
<div class="sp-slide">
    <div class="sp-text">
        I have different height
    </div>
</div>
<div class="sp-slide">
    <div class="sp-text">
        I have an another height
    </div>
</div>
  

Вот моя функция jQuery :

 function sliderText_center() {
    $('.sp-text').each(function() {
        var container = $('.sp-slide');
        var content = $('.sp-text');

        $(this).css("left", (container.width()-content.width())/2);
        $(this).css("top", (container.height()-content.height())/2);
    });
}
  

Как получить каждую высоту sp-текста независимо?

Комментарии:

1. $('.sp-text') обратитесь ко всем элементам .sp-text . Вместо этого вы должны использовать $(this) . Также используйте $(this).parent() вместо $('.sp-slide') .

2. @Мохаммад, отлично! это выполнено, спасибо