Ajax с эффектами слайдов уже без использования набора инструментов

Я действительно не так хорошо разбираюсь в Javascript, поэтому мне нужна еще одна помощь. Я хочу иметь возможность немного поработать с AJAX с помощью PHP, а затем, когда ответ ajax завершен, показать ответ в div и красиво СДВИГАТЬ его.

Основная сторона AJAX - не проблема. Но я хочу, чтобы он плавно скользил без использования каких-либо фреймворков, таких как jQuery или MooTools. В основном для обучения, но есть и другие причины. Так что любая помощь очень простым способом будет кстати. Я не могу найти много в Интернете. Если мне придется использовать jQuery, я думаю, что смогу, я играл с ним, но я не фанат Javascript в лучшие времена ...

Так что да, практически любые советы / подсказки / мысли / помощь были бы действительно кстати!


person rich    schedule 07.10.2009    source источник


Ответы (2)


Я предполагаю, что основы будут чем-то вроде timeOut () в сочетании с увеличением высоты до полной высоты:

  1. установите для отображения элемента значение none
  2. получить полную высоту элемента, например:
    document.getelementById ('IDofElement'). style.height
  3. установите высоту на 0, а отображение на что-то вроде блока
  4. установите timeOut () и увеличьте высоту в вызываемая функция, активируйте новую функцию timeOut (), если элемент еще не достиг полной высоты.

Единственный реальный недостаток отказа от использования библиотеки заключается в том, что вам придется тестировать во множестве разных браузеров и, возможно, вносить изменения в соответствии с используемым браузером. Библиотеки уже решили эту проблему за вас.

person jeroen    schedule 07.10.2009
comment
Ладно, играть со всем этим действительно имеет смысл. Однако я полагаю, что высота должна быть уже установлена ​​в CSS? Или есть способ установить переменную высоты? Извините за вопросы! - person rich; 07.10.2009
comment
Обычно я использую jQuery, но думаю, что document.getelementById ('IDofElement'). Style.height можно использовать как для установки, так и для получения высоты. - person jeroen; 07.10.2009
comment
Я не мог понять, как получить высоту div, когда в нем был запрос ajax, без автоматического указания высоты ... работал с этим, чтобы получить полную высоту ПЕРЕД установкой его на 0: var fHeight = document.getElementById (' slideDiv '). offsetHeight; - person rich; 04.11.2009
comment
и, если необходимо, вот рабочая версия + еще один вопрос (ответ): stackoverflow.com/questions/1673336/ - person rich; 09.11.2009

Лично я бы просто использовал JQuery. Если вы хотите посмотреть, как они это делают, скачайте версию библиотеки для разработчиков и посмотрите код.

Если вы не являетесь поклонником javascript, то воспользуйтесь библиотекой, значит, вам придется писать меньше.

person Paddy    schedule 07.10.2009
comment
Я знаю, но ... Мне действительно нужно иметь возможность делать это без библиотеки, если я могу с ней работать. - person rich; 07.10.2009
comment
Затем перейдите к первой части ответа - посмотрите код в библиотеке JQuery и напишите свою версию. - person Paddy; 07.10.2009