Jquery Ninja questions re toggle and animate

Page 55 of JQuery Novice to Ninja shows the following code. When the page is run you CLICK on the first paragraph and the animation is triggered BUT I do not see any CLICK EVENT in this script. Isn’t the document.ready function the trigger? What am I missing? I have read the forum guidelines and I do not see a specific place to ask for tech support for specific questions regarding a Sitepoint book.

$(‘p:first’).toggle(function() {
$(this).animate( {‘height’:‘+=150px’}, 2000, ‘linear’)
}, function() {
$(this).animate( {‘height’:‘-=150px’}, 2000, ‘swing’);

1 Like

It is indeed a little confusing at first glance, because there are two .toggle() methods.

The one most people are familiar with is the animation method that’s used to toggle an elements’ visibility. (See: http://api.jquery.com/toggle/)

The other is an event handler that binds to the click event and will fire alternate event handlers when the targeted element is clicked.

As per http://api.jquery.com/toggle-event/:

Description: Bind two or more handlers to the matched elements, to be executed on alternate clicks.

Wow. Thank you. Clearly that should have been pointed out in the book! You saved y mental health!