i’m trying to load the content of a page with an animation.
example:
if i understand it right, i have to load the content of the black .content box via AJAX.
after some research in the forum i found this thread: Need help with Ajax requests with Kirby
Yep, like that. Use some console.log() commands together with an open console to check if your code does what you expect it do do (is the button clicked, it the URL correct, do you get the right reponse etc.)
With the second question I guess you refer to accessing elements that are added to the DOM later? If so, you can use code like this (just an example)
$('some-element').on('click', 'body', function(e){
// do something
});
That is, you delegate the event by adding an existing parent element (here: body) within the on() function.
When a selector is provided, the event handler is referred to as delegated. The handler is not called when the event occurs directly on the bound element, but only for descendants (inner elements) that match the selector. jQuery bubbles the event from the event target up to the element where the handler is attached (i.e., innermost to outermost element) and runs the handler for any elements along that path matching the selector.
Event handlers are bound only to the currently selected elements; they must exist at the time your code makes the call to .on(). To ensure the elements are present and can be selected, place scripts after the elements in the HTML markup or perform event binding inside a document ready handler. Alternatively, use delegated events to attach event handlers.
(.on() | jQuery API Documentation)