Вертикальное и горизонтальное выравнивание (хром и сафари) с использованием jQuery

Question

Я использую CSS, обновленный jQuery, чтобы центрировать текст в div.Высота div зависит от размера изображения.Он хорошо работает в IE и Firefox, но не в Chrome и Safari.

Я пробовал следующее:

$(window).load(function() {
    var hli = $('#article li').height();

});

Вместо $(document).ready(), чтобы поймать высоту и использовать ее для обновления CSSно это всегда возвращает 0.Вы можете увидеть пример по этому адресу: http://www.racinedecha.com/test/test.html

Текст должен появиться, когда пользователь наводит курсор на картинку.

Answer 1

попробуйте использовать:

$(document).ready(function(){
   $('#article li img').load(function(){
      var hli = $('#article li').height();
   })    
});

ОБЪЯСНЕНИЕ: В Chrome и Safari, если ширина или высота изображения не определены, вы не можете получить их через js, пока изображение не будет загружено.Теперь $(window).load( на самом деле не ожидает загрузки каждого изображения, поэтому я прикрепил load event к каждому изображению, и после его загрузки вы можете получить его properties.

Надеюсьэто объясняет проблему.:)

Answer 2

Как насчет простого добавления текста в html и добавления изображения в качестве background-image в css?