Tuesday, April 27, 2010

jQuery : braindump ~ tips/tricks

Note: These are braindumps !

While learning any topic I make notes, at first they are very basic and progressively they get advanced.

Don't expect super wisdom ("Gyan") out of these.
As I said just braindumps 8-)

If you have some tips you'd like to share, post in comments and I'll include them here for everybodys benefit.

jQuery

Enable/Disable a checkbox

var t = "#show_1234" + crFarmID;

$(t).attr("disabled", false); // Enable the show/hide button again

$(t).attr("disabled", true); // Disable the show/hide button again

Check/Uncheck checkboxes

t = "#myCheckBoxID";

$(t).attr('checked', false); // uncheck the "edit" checkbox

Change Background color of a DIV

showDiv = "#IDOfDIVToChangeColor"; // Color the showhide DIV again

$(showDiv).css('background-color', crColor);

Click an Element

var t = "#IWantToClickThisDIVID";

$(t).trigger("click");

Floating message box

Great one from Roshan - http://roshanbh.com.np/2008/07/top-floating-message-box-using-jquery.html

After the message is shown, I actually blink it to grab a bit of the users attention, by doing so -

$("#message_box").fadeOut(450).fadeIn(350);

450 & 350 time gaps make it subtle.

Change transparency of a DIV

$("#MY_DIV_ID").css({ "opacity" : 0.95 });

Change HREF in an anchor

$("#MY_DIV_ID").attr("href", "www.google.com/");


Select all DIVs with an ID like x. The below example, selects all DIVs with name lineItem, e.g. lineItem-1, lineItem-2, etc.
$('div[id*=lineItem]').css('border','3px dotted green');

No comments:

Post a Comment