jquery-gp-gallery.js - разное отображение подгружаемых изображений
Вложений: 3
Здравствуйте.
С загрузкой изображений на сервер разобрался, еще раз спасибо пользователю Serg_pnz. Настало время изображения красиво выводить :) Очень недолгие поиски привели меня к плагину jquery-gp-gallery - его возможности включают в себя все то, что я хотел (если очень вкратце - вывод фотографий "как в гугл плюс"). Все было замечательно, пока я не стал подгружать фотографии на страницу с помощью AJAX. Итак, имеем HTML: <div class='pictures'> <a href='/uploads/2012/99.jpg'><img src='/uploads/2012/thumbs/99.jpg'></a> <a href='/uploads/2012/98.jpg'><img src='/uploads/2012/thumbs/98.jpg'></a> <a href='/uploads/2012/97.jpg'><img src='/uploads/2012/thumbs/97.jpg'></a> <div class='clear'></div> </div> <div> <a href='#' id='morephoto' onclick='return false;'>+ Показать еще фотографии</a> </div> div.pictures - контейнер с фотографиями. Он имеет ограниченную ширину (width), изображения не выходят за его границы. Внутри находятся, собственно, сами изображения в контейнерах-ссылках. Ничего примечательного, для работы плагина даже не требуется помечать их каким-либо классом. Также, внутри, после списка изображений находится div.clear, необходимый плагину для красивого отображения фотографий. Следующий div со ссылкой a#morephoto - уже мой. Клик по ссылке отлавливается в коде и, как уже понятно, на сервер отсылается запрос на загрузку фотографий. $('#morephoto').click(function() { $.ajax({ url:'ajax.php', type:'POST', data:'offset=' + galleryOffset + '&photocount=' + galleryAjaxPhotoCountLoad, success: function(data, textStatus) { $('.clear').before(data); $('.pictures a img').removeAttr('style'); // без этого плагин начинает после ~5-ой подгрузки картинок отображать их так, будто контейнер стал более узким (на деле это не так) $('.pictures').gpGallery('a'); // собственно, "включаем" красивое отображение для подгруженных фотографий galleryOffset += galleryAjaxPhotoCountLoad; // не обращайте внимания; всего лишь указание с какой фотографии подгружать по следующему ajax-запросу } }); }); В переменную data отдается просто html-код со следующими фотографиями (код аналогичен HTML-коду выше). Я проверял Firebug'ом на каждом шаге, в html-коде не появляется ничего лишнего. Впрочем, думаю, моя проблема либо в плагине, либо в jQuery, либо в браузерах (надеюсь, что не в них). Итак, проблема: подгруженные фотографии в браузерах выглядят ну очень по-разному.
IE даже запускать боюсь :) Чуть не забыл. В Opera смотрел код страницы в момент создания скриншота - там для этих кривых изображений явно была задана ширина (width) в стилях! Более 700px, что как раз занимает весь контейнер. Есть мысли насчет этого? Подходят к концу вторые сутки моих мучений, мне нужна помощь :( |
Извините за ап темы, но неужели ни у кого нет идей? Проблема так и не решена, я уже в шаге от начала изобретения собственного велосипеда (:
|
Часовой пояс GMT +3, время: 08:57. |