1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294

// view the full video at:
// http://jquery14.com/day-05/jquery-1-4-hawtness-1-with-paul-irish

/* d8b  .d88888b.                                         d888          d8888  
   Y8P d88P" "Y88b                                       d8888         d8P888  
       888     888                                         888        d8P 888  
  8888 888     888 888  888  .d88b.  888d888 888  888      888       d8P  888  
  "888 888     888 888  888 d8P  Y8b 888P"   888  888      888      d88   888  
   888 888 Y8b 888 888  888 88888888 888     888  888      888      8888888888 
   888 Y88b.Y8b88P Y88b 888 Y8b.     888     Y88b 888      888   d8b      888  
   888  "Y888888"   "Y88888  "Y8888  888      "Y88888    8888888 Y8P      888  
   888        Y8b                                 888                          
  d88P                                       Y8b d88P                          
888P"                                         "Y88P"                           

888    888                        888                                        
888    888                        888                                        
888    888                        888                                        
8888888888  8888b.  888  888  888 888888 88888b.   .d88b.  .d8888b  .d8888b  
888    888     "88b 888  888  888 888    888 "88b d8P  Y8b 88K      88K      
888    888 .d888888 888  888  888 888    888  888 88888888 "Y8888b. "Y8888b. 
888    888 888  888 Y88b 888 d88P Y88b.  888  888 Y8b.          X88      X88 
888    888 "Y888888  "Y8888888P"   "Y888 888  888  "Y8888   88888P'  88888P'


                              #1: live() and closest()


db   d8b   db d888888b d888888b db   db 
88   I8I   88   `88'   `~~88~~' 88   88 
88   I8I   88    88       88    88ooo88 
Y8   I8I   88    88       88    88~~~88 
`8b d8'8b d8'   .88.      88    88   88 
 `8b8' `8d8'  Y888888P    YP    YP   YP 
                                                                                
d8888b.  .d8b.  db    db db          d888888b d8888b. d888888b .d8888. db   db 
88  `8D d8' `8b 88    88 88            `88'   88  `8D   `88'   88'  YP 88   88 
88oodD' 88ooo88 88    88 88             88    88oobY'    88    `8bo.   88ooo88 
88~~~   88~~~88 88    88 88             88    88`8b      88      `Y8b. 88~~~88 
88      88   88 88b  d88 88booo.       .88.   88 `88.   .88.   db   8D 88   88 
88      YP   YP ~Y8888P' Y88888P     Y888888P 88   YD Y888888P `8888Y' YP   YP

*/







/*
    oooo   o8o                        
    `888   `"'                        
     888  oooo  oooo    ooo  .ooooo.  
     888  `888   `88.  .8'  d88' `88b 
     888   888    `88..8'   888ooo888 
     888   888     `888'    888    .o 
    o888o o888o     `8'     `Y8bod8P'                                  
*/




// all <a href="#anchor"> smoothscroll to those elements

$("a[href^=#][href!=#]").live('click',function(e){

    $('html,body').animate({'scrollTop': $($(this).attr('href')).offset().top+'px'}); 

    e.preventDefault();

});









// all dropdowns, including dynamically added ones execute this when the value is changed

$('select').live('change',function(e){

	console.log( e.target, ' has been changed to ', $(this).val() );
	
});

// already worked in FF..









// all forms, including dynamically added ones execute this when they are submitted

$('form').live('submit',function(e){

	console.log(e.target,' has sumbitted');
	
});








// focusin and focusout for focus/blur
$('input:text').live('focusout',function(){

   checkValidation( this, $(this).val() );

});







// hinting with default placeholder values for text input items. 

// $('input[placeholder]').placeholder();

$.fn.placeholder = function(){

   // quit if there's support  for html5 placeholder
  if (this[0] && 'placeholder' in document.createElement('input')) return; 

  return this
    .live('focusin',function(){

      if ($(this).val() === $(this).attr('placeholder')) {
        $(this).val('');
      }

    }).live('focusout',function(){

      if ($(this).val() === ''){
        $(this).val( $(this).attr('placeholder') );
      }_  
    });
}
// updates:
// thx to jkline for the tip. this works now

// mathias bynens has blown this code out into a full plugin:
//     http://github.com/mathiasbynens/Placeholder-jQuery-Plugin




// mouseenter mouseleave
// colorize the hoverboxes when people hover in and out of them

$('div.hoverbox').live('mouseenter mouseleave',function(e){

    var isEnter = (e.type === 'mouseenter');

    $(this).css('backgroundColor', isEnter ? 'red' : 'blue');

});







// using data{} with live()

$('#content a.external').live('click',{ bindtime : new Date() },function(e){

	var clicktime = new Date(),
	    duration  = (clicktime - e.data.bindtime) / 1000;
	    
	console.log(duration,' seconds between binding and clicking');
});










// custom events with live()
$("p").live("myCustomEvent", function(e, myName, myValue){

      $(this).text("Hi there!");

      $("span").stop().css("opacity", 1)
               .text("myName = " + myName)
               .fadeIn(30).fadeOut(1000);

});


$("button").click(function () {
  $("p").trigger("myCustomEvent");
});






// performance optimization: providing a context for your delegation
// will execute much quicker on every click, vs $('a.external').live(....

$('a.external', $('#content')[0] ).live('click',function(){.....











/*
              oooo                                            .   
              `888                                          .o8   
     .ooooo.   888   .ooooo.   .oooo.o  .ooooo.   .oooo.o .o888oo 
    d88' `"Y8  888  d88' `88b d88(  "8 d88' `88b d88(  "8   888   
    888        888  888   888 `"Y88b.  888ooo888 `"Y88b.    888   
    888   .o8  888  888   888 o.  )88b 888    .o o.  )88b   888 . 
    `Y8bod8P' o888o `Y8bod8P' 8""888P' `Y8bod8P' 8""888P'   "888"

*/







// closest(Array)
  jQuery("body").closest(["body","html"])

// returns an object like this:
   [{selector:"body", elem:document.body}, {selector:"html", elem:document.documentElement}]








// performance optimization: providing a context for your delegation
// only elements div.post within #content will be found.

var post = $('a.external').closest('div.post', $('#content')[0])










                                  d8b                                                          888 
                                  Y8P                                                          888 
                                                                                               888 
    .d8888b .d88b.  88888b.d88b.  888 88888b.   .d88b.     .d8888b   .d88b.   .d88b.  88888b.  888 
   d88P"   d88""88b 888 "888 "88b 888 888 "88b d88P"88b    88K      d88""88b d88""88b 888 "88b 888 
   888     888  888 888  888  888 888 888  888 888  888    "Y8888b. 888  888 888  888 888  888 Y8P 
   Y88b.   Y88..88P 888  888  888 888 888  888 Y88b 888         X88 Y88..88P Y88..88P 888  888  "  
    "Y8888P "Y88P"  888  888  888 888 888  888  "Y88888     88888P'  "Y88P"   "Y88P"  888  888 888 
                                                    888                                            
                                               Y8b d88P                                            
                                                "Y88P"                                             


// setterMethods(function(i,val){ ... }) and animation
// events! bind(). proxy(). special
// traversing and manipulation
// *ajax!*
// utilities
// what may break in 1.4 for you.'