$(selector).

action()

$(this).hide() - hides current element $("p").hide() - hides all paragraphs $("p.test").hide() - hides all paragraphs with class="test" $("#test").hide() - hides the element with id="test"

$(document).ready(function(){ // jQuery functions go here... }); - to prevent any jQuery code from running before the document is finished loading (is ready).

$("[href]") select all elements with an href attribute. $("[href='#']") select all elements with an href value equal to "#". $("[href!='#']") select all elements with an href attribute NOT equal to "#". $("[href$='.jpg']") select all elements with an href attribute that ends with ".jpg".

$("p").css("background-color","yellow");

$("button").click(function() {..some code... } )

$(p.intro, #choose) Event Method $(document).ready(function) Description

Binds a function to the ready event of a document (when the document is finished loading) Triggers, or binds a function to the click event of selected $(selector).click(function) elements Triggers, or binds a function to the double click event of $(selector).dblclick(function) selected elements Triggers, or binds a function to the focus event of selected $(selector).focus(function) elements Triggers, or binds a function to the mouseover event of $(selector).mouseover(function) selected elements Metodele pentru manipularea evenimentelor Method bind() Description Add one or more event handlers to matching elements Triggers, or binds a function to the blur event of blur() selected elements Triggers, or binds a function to the change event of change() selected elements Triggers, or binds a function to the click event of click() selected elements Triggers, or binds a function to the dblclick event of dblclick() selected elements Add one or more event handlers to current, or future, delegate() specified child elements of the matching elements Remove all event handlers added with the live() die() function Triggers, or binds a function to the error event of error() selected elements The current DOM element within the event bubbling event.currentTarget phase Contains the optional data passed to jQuery.fn.bind event.data when the current executing handler was bound Returns whether event.preventDefault() was called for event.isDefaultPrevented() the event object Returns whether event.stopImmediatePropagation() event.isImmediatePropagationStopped() was called for the event object Returns whether event.stopPropagation() was called event.isPropagationStopped() for the event object The mouse position relative to the left edge of the event.pageX document The mouse position relative to the top edge of the event.pageY document event.preventDefault() Prevents the default action of the event

event.relatedTarget event.result event.stopImmediatePropagation() event.stopPropagation() event.target event.timeStamp event.type event.which focus() focusin() focusout() hover() keydown() keypress() keyup() live() load() mousedown() mouseenter() mouseleave() mousemove() mouseout() mouseover() mouseup() one()

The other DOM element involved in the event, if any This attribute contains the last value returned by an event handler that was triggered by this event, unless the value was undefined Prevents other event handlers from being called Prevents the event from bubbling up the DOM tree, preventing any parent handlers from being notified of the event The DOM element that initiated the event This attribute returns the number of milliseconds since January 1, 1970, when the event is triggered Describes the nature of the event Which key or button was pressed for a key or button event Triggers, or binds a function to the focus event of selected elements Binds a function to the focusin event of selected elements Binds a function to the focusout event of selected elements Binds one or two functions to the hover event of selected elements Triggers, or binds a function to the keydown event of selected elements Triggers, or binds a function to the keypress event of selected elements Triggers, or binds a function to the keyup event of selected elements Add one or more event handlers to current, or future, matching elements Triggers, or binds a function to the load event of selected elements Triggers, or binds a function to the mouse down event of selected elements Triggers, or binds a function to the mouse enter event of selected elements Triggers, or binds a function to the mouse leave event of selected elements Triggers, or binds a function to the mouse move event of selected elements Triggers, or binds a function to the mouse out event of selected elements Triggers, or binds a function to the mouse over event of selected elements Triggers, or binds a function to the mouse up event of selected elements Add one or more event handlers to matching elements. This handler can only be triggered once per element

ready() resize() scroll() select() submit() toggle() trigger() triggerHandler() unbind() undelegate() unload()

Binds a function to the ready event of a document (when an HTML document is ready to use) Triggers, or binds a function to the resize event of selected elements Triggers, or binds a function to the scroll event of selected elements Triggers, or binds a function to the select event of selected elements Triggers, or binds a function to the submit event of selected elements Binds two or more functions to the toggle between for the click event for selected elements Triggers all events bound to the selected elements Triggers all functions bound to a specified event for the selected elements Remove an added event handler from selected elements Remove an event handler to selected elements, now or in the future Triggers, or binds a function to the unload event of selected elements

Efecte Method animate() clearQueue() delay() dequeue() fadeIn() fadeOut() fadeTo() fadeToggle() hide() queue() show() slideDown() slideToggle() slideUp() stop() toggle() Description Performs a custom animation (of a set of CSS properties) for selected elements Removes all queued functions for the selected element Sets a delay for all queued functions for the selected element Runs the next queued functions for the selected element Gradually changes the opacity, for selected elements, from hidden to visible Gradually changes the opacity, for selected elements, from visible to hidden Gradually changes the opacity, for selected elements, to a specified opacity Hides selected elements Shows the queued functions for the selected element Shows hidden selected elements Gradually changes the height, for selected elements, from hidden to visible Toggles between slideUp() and slideDown() for selected elements Gradually changes the height, for selected elements, from visible to hidden Stops a running animation on selected elements Toggles between hide() and show(), or custom functions, for selected elements

$(selector).hide(speed,callback)

$(selector).show(speed,callback) $(selector).toggle(speed,callback) $(selector).slideDown(speed,callback) $(selector).slideUp(speed,callback) $(selector).slideToggle(speed,callback) $(selector).fadeIn(speed,callback) $(selector).fadeOut(speed,callback) $(selector).fadeTo(speed,opacity,callback) - allows fading to a given opacity. $(selector).animate({params},[duration],[easing],[callback]) The key parameter is params. It defines the CSS properties that will be animated. Many properties can be animated at the same time: animate({width:"70%",opacity:0.4,marginLeft:"0.6in",fontSize:"3em"}); The second parameter is duration. It specifies the speed of the animation. Possible values are "fast", "slow", "normal", or milliseconds.
HTML elements are positioned static by default and cannot be moved. To make elements moveable, set the CSS position property to fixed, relative or absolute.

The callback parameter is the name of a function to be executed after the hide (or show) function completes. A callback function is executed after the current animation is 100% finished. The speed parameter can take the following values: "slow", "fast", "normal", or milliseconds. $("p").hide(1000,function(){ alert("The paragraph is now hidden"); });

$(selector).html(content)
$(selector).append(content) The append() method appends content to the inside of matching HTML elements. $(selector).prepend(content) The prepend() method "prepends" content to the inside of matching HTML elements. $(selector).after(content)

The after() method inserts HTML content after all matching elements. $(selector).before(content) The before() method inserts HTML content before all matching elements. Method addClass() after() append() appendTo() attr() before() clone() detach() empty() hasClass() html() insertAfter() insertBefore() prepend() prependTo() remove() removeAttr() removeClass() replaceAll() replaceWith() text() toggleClass() unwrap() val() wrap() wrapAll() wrapInner() Description Adds one or more classes (for CSS) to selected elements Inserts content after selected elements Inserts content at the end of (but still inside) selected elements Inserts content at the end of (but still inside) selected elements Sets or returns an attribute and value of selected elements Inserts content before selected elements Makes a copy of selected elements Removes (but keeps a copy of) selected elements Removes all child elements and content from selected elements Checks if any of the selected elements have a specified class (for CSS) Sets or returns the content of selected elements Inserts HTML markup or elements after selected elements Inserts HTML markup or elements before selected elements Inserts content at the beginning of (but still inside) selected elements Inserts content at the beginning of (but still inside) selected elements Removes selected elements Removes an attribute from selected elements Removes one or more classes (for CSS) from selected elements Replaces selected elements with new content Replaces selected elements with new content Sets or returns the text content of selected elements Toggles between adding/removing one or more classes (for CSS) from selected elements Removes the parent element of the selected elements Sets or returns the value attribute of the selected elements (form elements) Wraps specified HTML element(s) around each selected element Wraps specified HTML element(s) around all selected elements Wraps specified HTML element(s) around the content of each selected element

The css() method has three different syntaxes, to perform different tasks.

css(name) - Return CSS property value css(name,value) - Set CSS property and value css({properties}) - Set multiple CSS properties and values

$("p").css({"background-color":"yellow","font-size":"200%"}); The following table lists all the methods used to manipulate CSS properties.

Method addClass() css() hasClass() height() offset() offsetParent() position() removeClass() scrollLeft() scrollTop() toggleClass() width()

Description Adds one or more classes to selected elements Sets or returns one or more style properties for selected elements Checks if any of the selected elements have a specified class Sets or returns the height of selected elements Sets or returns the position (relative to the document) for selected elements Returns the first parent element that is positioned Returns the position (relative to the parent element) of the first selected element Removes one or more classes from selected elements Sets or returns the horizontal position of the scrollbar for the selected elements Sets or returns the vertical position of the scrollbar for the selected elements Toggles between adding/removing one or more classes from selected elements Sets or returns the width of selected elements

$(selector).load(url,data,callback)