As I begin to learn jQuery, I have taken it upon myself to read the documentation first. Attempting to learn several methods that can in the future help me or anyone reading this, solve problems that might arise, by using more applicable methods. Here are a few I have found across the web.

.data(key, value) or .data(obj)

As jQuery puts it allows us to “Store arbitrary data associated with the matched elements or return the value at the named data store for the first element in the set of matched elements.” What is cool about this type of method is that it allows the user to store these values with keys or as objects while being safe of circular references.

Circular references are instances in which the data in question is dependent upon another set of data. However, that data is dependent on the first set of data to begin with. Here is the example for using .data() and calling it respectively.

Screen Shot 2015-10-19 at 8.53.19 AM

Here what would be shown is : “The values stored were 16 and pizza!


I found this one to be incredibly interesting. Although I haven’t been able to implement it myself as of now, viewing and playing with several examples it seems very useful in animations and functionality. “When .stop() is called on an element, the currently-running animation (if any) is immediately stopped. If, for instance, an element is being hidden with .slideUp() when .stop() is called, the element will now still be displayed, but will be a fraction of its previous height. Callback functions are not called.”

Screen Shot 2015-10-19 at 9.12.22 AM

Screen Shot 2015-10-19 at 9.13.30 AM

This buttons use the animate and stop functions above. I have removed most of the code provided by jQuery as to make it a brief read but stop is very interesting. When the button STOP! is clicked it will call the .stop() method and immediately stop the entire animate. It will resume once another function is called such as Go or Back.

.delay(duration[, queueName])

As with the .stop() function above this will render some really cool functionality and effects that you may want to use to make your code particularly useful. Instead of making your code completely stop you can have it delay or pause for the duration inputted in milliseconds.

“.delay() method allows us to delay the execution of functions that follow it in the queue. It can be used with the standard effects queue or with a custom queue. Only subsequent events in a queue are delayed; for example this will not delay the no-arguments forms of .show() or .hide() which do not use the effects queue.

Durations are given in milliseconds; higher values indicate slower animations, not faster ones. The strings ‘fast’ and ‘slow’ can be supplied to indicate durations of 200 and 600 milliseconds, respectively.”

Screen Shot 2015-10-19 at 9.26.52 AM

Screen Shot 2015-10-19 at 9.27.10 AM

Useful Materials

I have also gone ahead and added several sources including the examples given by jQuery.

jQuery “.delay()”

jQuery “.data()”

Commonly used snippets for jQuery