jQuery / CSS связанная проблема

Question

Я новичок в jQuery, и это страница, которую я сейчас разрабатываю.

http://90.230.237.71/gandhi.html (надеюсь, что сейчас работает: P)

Я тестируюВаши советы на странице gandhi2.html

Когда я нажимаю «Показать / скрыть галерею», все изображения сначала открываются по вертикали, а затем корректируются по горизонтали, вот в чем проблема.Они должны быть горизонтальными прямо сейчас!Я не знаю, связано ли это с jQuerys slideDown или полностью связано с CSS, но для вас есть весь код.

Первоначально изображения настроены на отображение: нет, возможно, они затем невидимо сохраняютсявертикально.Затем выполняется slideDown и, наконец, CSS-атрибуты меняются на «display: inline».Возможно, мне нужно изменить порядок выполнения функции slideDown и установить атрибуты CSS ... но как?

Мне нужна помощь ... по многим причинам, но я только хочу, чтобы вы помогли мне с этим;)

А также, пожалуйста, посмотрите на код, прежде чем делать какие-либо предположения.Это все в коде.

РЕДАКТИРОВАТЬ

Работает, изменив одну строку в jQuery.Строка 5738, я изменился с this.elem.style.display = "block";to this.elem.style.display = "inline-block";

Нужно ли мне использовать мою собственную модифицированную версию jQuery или я могу просто переопределить это значение с моей html-страницы?Возможно, я должен начать новую тему по этому вопросу ...

Answer 1

slideDown устанавливает для CSS-свойства display значение block; что вы, кажется, поняли, когда вы измените его на inline в вашем slideDown обратном вызове.

Вместо того, чтобы анимировать каждое изображение отдельно, вы должны обернуть их в элемент уровня блока (ul.navlist?) И slideDown() вместо этого.

Answer 2

В вашей таблице стилей попробуйте установить для элементов li значение display: inline-block. Затем в начале вашего jQuery используйте $(/*li elements*/).hide().

EDIT:

Нашел проблему: http://dev.jquery.com/browser/trunk/jquery/src/fx.js#L269

РЕДАКТИРОВАТЬ 2:

Исправлено: http://www.jsfiddle.net/aUAAm/

Answer 3

Они показываются мне горизонтально, когда я нажимаю на ссылку "Показать / скрыть галерею". Кроме того, попробуйте скрыть с помощью jquery в обработчике ready вместо использования display:none в CSS, чтобы jquery запоминал свои начальные настройки отображения, например, block и т. Д.

$(function()){
  $('.gallery_container img').hide();
};