Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Merge branch 'master' of github.com:jquery/jquery-mobile

  • Loading branch information...
commit 93cf7e407cb250da7fdce12fb82583008587a7f5 2 parents 40d32c8 + 0fd3a0b
John Resig jeresig authored
Showing with 17 additions and 21,785 deletions.
  1. BIN  docs/_assets/images/version.png
  2. +6 −6 docs/pages/docs-pages.html
  3. +0 −2  docs/pages/link-formats.html
  4. +11 −11 docs/toolbars/footer-persist-b.html
  5. +0 −168 experiments/api-viewer/docs/add/index.html
  6. +0 −97 experiments/api-viewer/docs/addClass/index.html
  7. +0 −132 experiments/api-viewer/docs/after/index.html
  8. +0 −58 experiments/api-viewer/docs/ajaxComplete/index.html
  9. +0 −56 experiments/api-viewer/docs/ajaxError/index.html
  10. +0 −56 experiments/api-viewer/docs/ajaxSend/index.html
  11. +0 −50 experiments/api-viewer/docs/ajaxStart/index.html
  12. +0 −50 experiments/api-viewer/docs/ajaxStop/index.html
  13. +0 −56 experiments/api-viewer/docs/ajaxSuccess/index.html
  14. +0 −96 experiments/api-viewer/docs/all-selector/index.html
  15. +0 −69 experiments/api-viewer/docs/andSelf/index.html
  16. +0 −311 experiments/api-viewer/docs/animate/index.html
  17. +0 −55 experiments/api-viewer/docs/animated-selector/index.html
  18. +0 −124 experiments/api-viewer/docs/append/index.html
  19. +0 −82 experiments/api-viewer/docs/appendTo/index.html
  20. +0 −212 experiments/api-viewer/docs/attr/index.html
  21. +0 −49 experiments/api-viewer/docs/attribute-contains-prefix-selector/index.html
  22. +0 −49 experiments/api-viewer/docs/attribute-contains-selector/index.html
  23. +0 −49 experiments/api-viewer/docs/attribute-contains-word-selector/index.html
  24. +0 −47 experiments/api-viewer/docs/attribute-ends-with-selector/index.html
  25. +0 −59 experiments/api-viewer/docs/attribute-equals-selector/index.html
  26. +0 −60 experiments/api-viewer/docs/attribute-not-equal-selector/index.html
  27. +0 −48 experiments/api-viewer/docs/attribute-starts-with-selector/index.html
  28. +0 −118 experiments/api-viewer/docs/before/index.html
  29. +0 −245 experiments/api-viewer/docs/bind/index.html
  30. +0 −59 experiments/api-viewer/docs/blur/index.html
  31. +0 −68 experiments/api-viewer/docs/button-selector/index.html
  32. +0 −104 experiments/api-viewer/docs/change/index.html
  33. +0 −71 experiments/api-viewer/docs/checkbox-selector/index.html
  34. +0 −64 experiments/api-viewer/docs/checked-selector/index.html
  35. +0 −63 experiments/api-viewer/docs/child-selector/index.html
  36. +0 −176 experiments/api-viewer/docs/children/index.html
  37. +0 −91 experiments/api-viewer/docs/class-selector/index.html
  38. +0 −68 experiments/api-viewer/docs/clearQueue/index.html
  39. +0 −99 experiments/api-viewer/docs/click/index.html
  40. +0 −72 experiments/api-viewer/docs/clone/index.html
  41. +0 −159 experiments/api-viewer/docs/closest/index.html
  42. +0 −48 experiments/api-viewer/docs/contains-selector/index.html
  43. +0 −85 experiments/api-viewer/docs/contents/index.html
  44. +0 −54 experiments/api-viewer/docs/context/index.html
  45. +0 −238 experiments/api-viewer/docs/css/index.html
  46. +0 −165 experiments/api-viewer/docs/data/index.html
  47. +0 −101 experiments/api-viewer/docs/dblclick/index.html
  48. +0 −65 experiments/api-viewer/docs/delay/index.html
  49. +0 −135 experiments/api-viewer/docs/delegate/index.html
  50. +0 −60 experiments/api-viewer/docs/dequeue/index.html
  51. +0 −67 experiments/api-viewer/docs/descendant-selector/index.html
  52. +0 −59 experiments/api-viewer/docs/detach/index.html
  53. +0 −106 experiments/api-viewer/docs/die/index.html
  54. +0 −43 experiments/api-viewer/docs/disabled-selector/index.html
  55. +0 −156 experiments/api-viewer/docs/each/index.html
  56. +0 −59 experiments/api-viewer/docs/element-selector/index.html
  57. +0 −52 experiments/api-viewer/docs/empty-selector/index.html
  58. +0 −66 experiments/api-viewer/docs/empty/index.html
  59. +0 −43 experiments/api-viewer/docs/enabled-selector/index.html
  60. +0 −134 experiments/api-viewer/docs/end/index.html
  61. +0 −50 experiments/api-viewer/docs/eq-selector/index.html
  62. +0 −86 experiments/api-viewer/docs/eq/index.html
  63. +0 −66 experiments/api-viewer/docs/error/index.html
  64. +0 −51 experiments/api-viewer/docs/even-selector/index.html
  65. +0 −31 experiments/api-viewer/docs/event.currentTarget/index.html
  66. +0 −32 experiments/api-viewer/docs/event.data/index.html
  67. +0 −32 experiments/api-viewer/docs/event.isDefaultPrevented/index.html
  68. +0 −46 experiments/api-viewer/docs/event.isImmediatePropagationStopped/index.html
  69. +0 −45 experiments/api-viewer/docs/event.isPropagationStopped/index.html
  70. +0 −43 experiments/api-viewer/docs/event.pageX/index.html
  71. +0 −43 experiments/api-viewer/docs/event.pageY/index.html
  72. +0 −50 experiments/api-viewer/docs/event.preventDefault/index.html
  73. +0 −31 experiments/api-viewer/docs/event.relatedTarget/index.html
  74. +0 −46 experiments/api-viewer/docs/event.result/index.html
  75. +0 −57 experiments/api-viewer/docs/event.stopImmediatePropagation/index.html
  76. +0 −49 experiments/api-viewer/docs/event.stopPropagation/index.html
  77. +0 −91 experiments/api-viewer/docs/event.target/index.html
  78. +0 −46 experiments/api-viewer/docs/event.timeStamp/index.html
  79. +0 −30 experiments/api-viewer/docs/event.type/index.html
  80. +0 −46 experiments/api-viewer/docs/event.which/index.html
  81. +0 −120 experiments/api-viewer/docs/fadeIn/index.html
  82. +0 −115 experiments/api-viewer/docs/fadeOut/index.html
  83. +0 −159 experiments/api-viewer/docs/fadeTo/index.html
  84. +0 −69 experiments/api-viewer/docs/file-selector/index.html
  85. +0 −155 experiments/api-viewer/docs/filter/index.html
  86. +0 −113 experiments/api-viewer/docs/find/index.html
  87. +0 −63 experiments/api-viewer/docs/first-child-selector/index.html
  88. +0 −48 experiments/api-viewer/docs/first-selector/index.html
  89. +0 −56 experiments/api-viewer/docs/first/index.html
  90. +0 −99 experiments/api-viewer/docs/focus/index.html
  91. +0 −53 experiments/api-viewer/docs/focusin/index.html
  92. +0 −60 experiments/api-viewer/docs/focusout/index.html
  93. +0 −116 experiments/api-viewer/docs/get/index.html
  94. +0 −49 experiments/api-viewer/docs/gt-selector/index.html
  95. +0 −52 experiments/api-viewer/docs/has-attribute-selector/index.html
  96. +0 −44 experiments/api-viewer/docs/has-selector/index.html
  97. +0 −77 experiments/api-viewer/docs/has/index.html
  98. +0 −63 experiments/api-viewer/docs/hasClass/index.html
  99. +0 −46 experiments/api-viewer/docs/header-selector/index.html
  100. +0 −127 experiments/api-viewer/docs/height/index.html
  101. +0 −75 experiments/api-viewer/docs/hidden-selector/index.html
  102. +0 −174 experiments/api-viewer/docs/hide/index.html
  103. +0 −160 experiments/api-viewer/docs/hover/index.html
  104. +0 −166 experiments/api-viewer/docs/html/index.html
  105. +0 −94 experiments/api-viewer/docs/id-selector/index.html
  106. +0 −67 experiments/api-viewer/docs/image-selector/index.html
  107. +0 −229 experiments/api-viewer/docs/index/index.html
  108. +0 −46 experiments/api-viewer/docs/innerHeight/index.html
  109. +0 −46 experiments/api-viewer/docs/innerWidth/index.html
  110. +0 −72 experiments/api-viewer/docs/input-selector/index.html
  111. +0 −71 experiments/api-viewer/docs/insertAfter/index.html
  112. +0 −71 experiments/api-viewer/docs/insertBefore/index.html
  113. +0 −141 experiments/api-viewer/docs/is/index.html
  114. +0 −252 experiments/api-viewer/docs/jQuery.ajax/index.html
  115. +0 −51 experiments/api-viewer/docs/jQuery.ajaxSetup/index.html
  116. +0 −59 experiments/api-viewer/docs/jQuery.boxModel/index.html
  117. +0 −162 experiments/api-viewer/docs/jQuery.browser/index.html
  118. +0 −33 experiments/api-viewer/docs/jQuery.contains/index.html
  119. +0 −147 experiments/api-viewer/docs/jQuery.data/index.html
  120. +0 −59 experiments/api-viewer/docs/jQuery.dequeue/index.html
  121. +0 −106 experiments/api-viewer/docs/jQuery.each/index.html
  122. +0 −32 experiments/api-viewer/docs/jQuery.error/index.html
  123. +0 −107 experiments/api-viewer/docs/jQuery.extend/index.html
  124. +0 −63 experiments/api-viewer/docs/jQuery.fx.off/index.html
  125. +0 −81 experiments/api-viewer/docs/jQuery.get/index.html
  126. +0 −113 experiments/api-viewer/docs/jQuery.getJSON/index.html
  127. +0 −88 experiments/api-viewer/docs/jQuery.getScript/index.html
  128. +0 −36 experiments/api-viewer/docs/jQuery.globalEval/index.html
  129. +0 −89 experiments/api-viewer/docs/jQuery.grep/index.html
  130. +0 −60 experiments/api-viewer/docs/jQuery.inArray/index.html
  131. +0 −43 experiments/api-viewer/docs/jQuery.isArray/index.html
  132. +0 −33 experiments/api-viewer/docs/jQuery.isEmptyObject/index.html
  133. +0 −77 experiments/api-viewer/docs/jQuery.isFunction/index.html
  134. +0 −32 experiments/api-viewer/docs/jQuery.isPlainObject/index.html
  135. +0 −32 experiments/api-viewer/docs/jQuery.isXMLDoc/index.html
  136. +0 −73 experiments/api-viewer/docs/jQuery.makeArray/index.html
  137. +0 −130 experiments/api-viewer/docs/jQuery.map/index.html
  138. +0 −61 experiments/api-viewer/docs/jQuery.merge/index.html
  139. +0 −106 experiments/api-viewer/docs/jQuery.noConflict/index.html
  140. +0 −27 experiments/api-viewer/docs/jQuery.noop/index.html
  141. +0 −116 experiments/api-viewer/docs/jQuery.param/index.html
  142. +0 −43 experiments/api-viewer/docs/jQuery.parseJSON/index.html
  143. +0 −106 experiments/api-viewer/docs/jQuery.post/index.html
  144. +0 −52 experiments/api-viewer/docs/jQuery.proxy/index.html
  145. +0 −43 experiments/api-viewer/docs/jQuery.pushStack/index.html
  146. +0 −182 experiments/api-viewer/docs/jQuery.queue/index.html
  147. +0 −62 experiments/api-viewer/docs/jQuery.removeData/index.html
  148. +0 −107 experiments/api-viewer/docs/jQuery.support/index.html
  149. +0 −59 experiments/api-viewer/docs/jQuery.trim/index.html
  150. +0 −67 experiments/api-viewer/docs/jQuery.unique/index.html
  151. +0 −214 experiments/api-viewer/docs/jQuery/index.html
  152. +0 −107 experiments/api-viewer/docs/keydown/index.html
  153. +0 −111 experiments/api-viewer/docs/keypress/index.html
  154. +0 −108 experiments/api-viewer/docs/keyup/index.html
  155. +0 −64 experiments/api-viewer/docs/last-child-selector/index.html
  156. +0 −45 experiments/api-viewer/docs/last-selector/index.html
  157. +0 −56 experiments/api-viewer/docs/last/index.html
  158. +0 −53 experiments/api-viewer/docs/length/index.html
  159. +0 −188 experiments/api-viewer/docs/live/index.html
  160. +0 −60 experiments/api-viewer/docs/load-event/index.html
  161. +0 −121 experiments/api-viewer/docs/load/index.html
  162. +0 −53 experiments/api-viewer/docs/lt-selector/index.html
  163. +0 −180 experiments/api-viewer/docs/map/index.html
  164. +0 −80 experiments/api-viewer/docs/mousedown/index.html
  165. +0 −115 experiments/api-viewer/docs/mouseenter/index.html
  166. +0 −115 experiments/api-viewer/docs/mouseleave/index.html
  167. +0 −98 experiments/api-viewer/docs/mousemove/index.html
  168. +0 −115 experiments/api-viewer/docs/mouseout/index.html
  169. +0 −115 experiments/api-viewer/docs/mouseover/index.html
  170. +0 −80 experiments/api-viewer/docs/mouseup/index.html
  171. +0 −50 experiments/api-viewer/docs/multiple-attribute-selector/index.html
  172. +0 −106 experiments/api-viewer/docs/multiple-selector/index.html
  173. +0 −58 experiments/api-viewer/docs/next-adjacent-Selector/index.html
  174. +0 −72 experiments/api-viewer/docs/next-siblings-selector/index.html
  175. +0 −89 experiments/api-viewer/docs/next/index.html
  176. +0 −103 experiments/api-viewer/docs/nextAll/index.html
  177. +0 −86 experiments/api-viewer/docs/nextUntil/index.html
  178. +0 −61 experiments/api-viewer/docs/not-selector/index.html
  179. +0 −124 experiments/api-viewer/docs/not/index.html
  180. +0 −142 experiments/api-viewer/docs/nth-child-selector/index.html
  181. +0 −51 experiments/api-viewer/docs/odd-selector/index.html
  182. +0 −131 experiments/api-viewer/docs/offset/index.html
  183. +0 −83 experiments/api-viewer/docs/offsetParent/index.html
  184. +0 −90 experiments/api-viewer/docs/one/index.html
  185. +0 −65 experiments/api-viewer/docs/only-child-selector/index.html
  186. +0 −49 experiments/api-viewer/docs/outerHeight/index.html
  187. +0 −54 experiments/api-viewer/docs/outerWidth/index.html
  188. +0 −51 experiments/api-viewer/docs/parent-selector/index.html
  189. +0 −120 experiments/api-viewer/docs/parent/index.html
  190. +0 −142 experiments/api-viewer/docs/parents/index.html
  191. +0 −91 experiments/api-viewer/docs/parentsUntil/index.html
  192. +0 −69 experiments/api-viewer/docs/password-selector/index.html
  193. +0 −50 experiments/api-viewer/docs/position/index.html
  194. +0 −122 experiments/api-viewer/docs/prepend/index.html
  195. +0 −77 experiments/api-viewer/docs/prependTo/index.html
  196. +0 −107 experiments/api-viewer/docs/prev/index.html
  197. +0 −68 experiments/api-viewer/docs/prevAll/index.html
  198. +0 −86 experiments/api-viewer/docs/prevUntil/index.html
  199. +0 −190 experiments/api-viewer/docs/queue/index.html
  200. +0 −74 experiments/api-viewer/docs/radio-selector/index.html
  201. +0 −73 experiments/api-viewer/docs/ready/index.html
  202. +0 −102 experiments/api-viewer/docs/remove/index.html
  203. +0 −50 experiments/api-viewer/docs/removeAttr/index.html
  204. +0 −132 experiments/api-viewer/docs/removeClass/index.html
  205. +0 −61 experiments/api-viewer/docs/removeData/index.html
  206. +0 −65 experiments/api-viewer/docs/replaceAll/index.html
  207. +0 −171 experiments/api-viewer/docs/replaceWith/index.html
  208. +0 −68 experiments/api-viewer/docs/reset-selector/index.html
  209. +0 −49 experiments/api-viewer/docs/resize/index.html
  210. +0 −93 experiments/api-viewer/docs/scroll/index.html
  211. +0 −93 experiments/api-viewer/docs/scrollLeft/index.html
  212. +0 −93 experiments/api-viewer/docs/scrollTop/index.html
  213. +0 −92 experiments/api-viewer/docs/select/index.html
  214. +0 −62 experiments/api-viewer/docs/selected-selector/index.html
  215. +0 −77 experiments/api-viewer/docs/selector/index.html
  216. +0 −114 experiments/api-viewer/docs/serialize/index.html
  217. +0 −134 experiments/api-viewer/docs/serializeArray/index.html
  218. +0 −166 experiments/api-viewer/docs/show/index.html
  219. +0 −115 experiments/api-viewer/docs/siblings/index.html
  220. +0 −60 experiments/api-viewer/docs/size/index.html
  221. +0 −135 experiments/api-viewer/docs/slice/index.html
  222. +0 −119 experiments/api-viewer/docs/slideDown/index.html
  223. +0 −124 experiments/api-viewer/docs/slideToggle/index.html
  224. +0 −125 experiments/api-viewer/docs/slideUp/index.html
  225. +0 −89 experiments/api-viewer/docs/stop/index.html
  226. +0 −161 experiments/api-viewer/docs/submit-selector/index.html
  227. +0 −109 experiments/api-viewer/docs/submit/index.html
  228. +0 −69 experiments/api-viewer/docs/text-selector/index.html
  229. +0 −138 experiments/api-viewer/docs/text/index.html
  230. +0 −63 experiments/api-viewer/docs/toArray/index.html
  231. +0 −204 experiments/api-viewer/docs/toggle/index.html
  232. +0 −141 experiments/api-viewer/docs/toggleClass/index.html
  233. +0 −127 experiments/api-viewer/docs/trigger/index.html
  234. +0 −69 experiments/api-viewer/docs/triggerHandler/index.html
  235. +0 −146 experiments/api-viewer/docs/unbind/index.html
  236. +0 −98 experiments/api-viewer/docs/undelegate/index.html
  237. +0 −44 experiments/api-viewer/docs/unload/index.html
  238. +0 −52 experiments/api-viewer/docs/unwrap/index.html
  239. +0 −208 experiments/api-viewer/docs/val/index.html
  240. +0 −66 experiments/api-viewer/docs/visible-selector/index.html
  241. +0 −132 experiments/api-viewer/docs/width/index.html
  242. +0 −163 experiments/api-viewer/docs/wrap/index.html
  243. +0 −141 experiments/api-viewer/docs/wrapAll/index.html
  244. +0 −152 experiments/api-viewer/docs/wrapInner/index.html
Sorry, we could not display the entire diff because it was too big.
BIN  docs/_assets/images/version.png
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
12 docs/pages/docs-pages.html
View
@@ -33,9 +33,9 @@
<html>
<head>
<title>Page Title</title>
- <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" />
- <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
- <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
+ <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a4.min.css" />
+ <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
+ <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a3.min.js"></script>
</head>
<body>
@@ -75,9 +75,9 @@
<html>
<head>
<title>Page Title</title>
- <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" />
- <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
- <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
+ <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a3.min.css" />
+ <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
+ <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4/jquery.mobile-1.0a3.min.js"></script>
</head>
<body>
2  docs/pages/link-formats.html
View
@@ -40,8 +40,6 @@
<li data-role="list-divider">Phone links</li>
<li><a href="tel:15555555555">Phone: tel:15555555555</a></li>
- <li><a href="wtai://wp/mc;15555555555">Phone: wtai://wp/mc;15555555555</a></li>
- <li><a href="dc:234*234*234">Phone: dc:234*234*234</a></li>
<li data-role="list-divider">Other</li>
<li><a href="#">A href="#" will return false</a></li>
</ul>
22 docs/toolbars/footer-persist-b.html
View
@@ -24,7 +24,7 @@
<img src="../lists/images/album-bb.jpg" />
<h3>Broken Bells</h3>
<p>Broken Bells</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
@@ -32,62 +32,62 @@
<h3>Warning</h3>
<p>Hot Chip</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-p.jpg" />
<h3>Wolfgang Amadeus Phoenix</h3>
<p>Phoenix</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-ok.jpg" />
<h3>Of The Blue Colour Of The Sky</h3>
<p>Ok Go</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-ws.jpg" />
<h3>Elephant</h3>
<p>The White Stripes</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-rh.jpg" />
<h3>Kid A</h3>
<p>Radiohead</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-xx.jpg" />
<h3>XX</h3>
<p>XX</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-mg.jpg" />
<h3>Congratulations</h3>
<p>MGMT</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-ag.jpg" />
<h3>Ashes Grammar</h3>
<p>A Sunny Day in Glasgow</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-k.jpg" />
<h3>Hot Fuss</h3>
<p>Killers</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
<li><a href="index.html">
<img src="../lists/images/album-af.jpg" />
<h3>The Suburbs</h3>
<p>Arcade Fire</p>
- </a><a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
+ </a><a href="../lists/lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
</a></li>
</ul>
168 experiments/api-viewer/docs/add/index.html
View
@@ -1,168 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><title>test</title><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.add()</h1>
-</div>
-<div data-role="content" data-theme="c" id="add1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.add( selector )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Add elements to the set of matched elements.</p>
-<ul class="signatures">
-<li class="signature" id="add-selector">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.add( selector )</h4>
-<p class="arguement"><strong>selector</strong>A string containing a selector expression to match additional elements against.</p>
-</li>
-<li class="signature" id="add-elements">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.add( elements )</h4>
-<p class="arguement"><strong>elements</strong>one or more elements to add to the set of matched elements.</p>
-</li>
-<li class="signature" id="add-html">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.add( html )</h4>
-<p class="arguement"><strong>html</strong>An HTML fragment to add to the set of matched elements.</p>
-</li>
-<li class="signature" id="add-selector-context">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.4/">1.4</a></span>.add( selector, context )</h4>
-<p class="arguement"><strong>selector</strong>A string containing a selector expression to match additional elements against.</p>
-<p class="arguement"><strong>context</strong>Add some elements rooted against the specified context.</p>
-</li>
-</ul>
-<div class="longdesc">
-<p>Given a jQuery object that represents a set of DOM elements, the <code>.add()</code> method constructs a new jQuery object from the union of those elements and the ones passed into the method. The argument to <code>.add()</code> can be pretty much anything that <code>$()</code> accepts, including a jQuery selector expression, references to DOM elements, or an HTML snippet.</p>
-<p>Consider a page with a simple list and a paragraph following it:</p>
-<pre>&lt;ul&gt;
- &lt;li&gt;list item 1&lt;/li&gt;
- &lt;li&gt;list item 2&lt;/li&gt;
- &lt;li&gt;list item 3&lt;/li&gt;
-&lt;/ul&gt;
-&lt;p&gt;a paragraph&lt;/p&gt;</pre>
-<p>We can select the list items and then the paragraph by using either a selector or a reference to the DOM element itself as the <code>.add()</code> method's argument:</p>
-<pre>$('li').add('p').css('background-color', 'red');</pre>
-<p>Or:</p>
-<pre>$('li').add(document.getElementsByTagName('p')[0])
- .css('background-color', 'red');</pre>
-<p>The result of this call is a red background behind all four elements.
-Using an HTML snippet as the <code>.add()</code> method's argument (as in the third version), we can create additional elements on the fly and add those elements to the matched set of elements. Let's say, for example, that we want to alter the background of the list items along with a newly created paragraph:</p>
-<pre>$('li').add('&lt;p id="new"&gt;new paragraph&lt;/p&gt;')
- .css('background-color', 'red');</pre>
-<p>Although the new paragraph has been created and its background color changed, it still does not appear on the page. To place it on the page, we could add one of the insertion methods to the chain.</p>
-<p>As of jQuery 1.4 the results from .add() will always be returned in document order (rather than a simple concatenation).</p>
-</div>
-<h3>Examples:</h3>
-<div id="entry-examples" class="entry-examples">
-<div id="example-0">
-<h4>Example: <span class="desc">Finds all divs and makes a border. Then adds all paragraphs to the jQuery object to set their backgrounds yellow.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
- div { width:60px; height:60px; margin:10px; float:left; }
- p { clear:left; font-weight:bold; font-size:16px;
- color:blue; margin:0 10px; padding:2px; }
- &lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;div&gt;&lt;/div&gt;
-
- &lt;div&gt;&lt;/div&gt;
- &lt;div&gt;&lt;/div&gt;
- &lt;div&gt;&lt;/div&gt;
- &lt;div&gt;&lt;/div&gt;
- &lt;div&gt;&lt;/div&gt;
-
- &lt;p&gt;Added this... (notice no border)&lt;/p&gt;
-&lt;script&gt;
-
-$("div").css("border", "2px solid red")
- .add("p")
- .css("background", "yellow");
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-1">
-<h4>Example: <span class="desc">Adds more elements, matched by the given expression, to the set of matched elements.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;Hello&lt;/p&gt;&lt;span&gt;Hello Again&lt;/span&gt;
-&lt;script&gt;$("p").add("span").css("background", "yellow");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-2">
-<h4>Example: <span class="desc">Adds more elements, created on the fly, to the set of matched elements.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;Hello&lt;/p&gt;
-&lt;script&gt;$("p").clone().add("&lt;span&gt;Again&lt;/span&gt;").appendTo(document.body);&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-3">
-<h4>Example: <span class="desc">Adds one or more Elements to the set of matched elements.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;Hello&lt;/p&gt;&lt;span id="a"&gt;Hello Again&lt;/span&gt;
-&lt;script&gt;$("p").add(document.getElementById("a")).css("background", "yellow");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-4">
-<h4>Example: <span class="desc">Demonstrates how to add (or push) elements to an existing collection</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;Hello&lt;/p&gt;&lt;span id="a"&gt;Hello Again&lt;/span&gt;
-&lt;script&gt;var collection = $("p");
-// capture the new collection
-collection = collection.add(document.getElementById("a"));
-collection.css("background", "yellow");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-</div>
-</div>
-</div>
-
- </div>
-
-</body></html>
97 experiments/api-viewer/docs/addClass/index.html
View
@@ -1,97 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.addClass()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="addClass1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.addClass( className )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Adds the specified class(es) to each of the set of matched elements.</p>
-<ul class="signatures">
-<li class="signature" id="addClass-className">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.addClass( className )</h4>
-<p class="arguement"><strong>className</strong>One or more class names to be added to the class attribute of each matched element.</p>
-</li>
-<li class="signature" id="addClass-functionindex, class">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.4/">1.4</a></span>.addClass( function(index, class) )</h4>
-<p class="arguement"><strong>function(index, class)</strong>A function returning one or more space-separated class names to be added. Receives the index position of the element in the set and the old class value as arguments.</p>
-</li>
-</ul>
-<div class="longdesc">
-<p>It's important to note that this method does not replace a class. It simply adds the class, appending it to any which may already be assigned to the elements.</p>
-<p>More than one class may be added at a time, separated by a space, to the set of matched elements, like so:</p>
-<pre>$('p').addClass('myClass yourClass');</pre>
-<p>This method is often used with <code>.removeClass()</code> to switch elements' classes from one to another, like so:</p>
-<pre>$('p').removeClass('myClass noClass').addClass('yourClass');</pre>
-<p>Here, the <code>myClass</code> and <code>noClass</code> classes are removed from all paragraphs, while <code>yourClass</code> is added.</p>
-<p>As of jQuery 1.4, the <code>.addClass()</code> method allows us to set the class name by passing in a function.</p>
-<pre>$('ul li:last').addClass(function() {
- return 'item-' + $(this).index();
-});</pre>
-<p>Given an unordered list with five <code>&lt;li&gt;</code> elements, this example adds the class "item-4" to the last <code>&lt;li&gt;</code>.</p>
-</div>
-<h3>Examples:</h3>
-<div id="entry-examples" class="entry-examples">
-<div id="example-0">
-<h4>Example: <span class="desc">Adds the class 'selected' to the matched elements.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
-
- p { margin: 8px; font-size:16px; }
- .selected { color:blue; }
- .highlight { background:yellow; }
- &lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;Hello&lt;/p&gt;
- &lt;p&gt;and&lt;/p&gt;
- &lt;p&gt;Goodbye&lt;/p&gt;
-&lt;script&gt;$("p:last").addClass("selected");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-1">
-<h4>Example: <span class="desc">Adds the classes 'selected' and 'highlight' to the matched elements.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
-
- p { margin: 8px; font-size:16px; }
- .selected { color:red; }
- .highlight { background:yellow; }
- &lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;Hello&lt;/p&gt;
- &lt;p&gt;and&lt;/p&gt;
- &lt;p&gt;Goodbye&lt;/p&gt;
-&lt;script&gt;$("p:last").addClass("selected highlight");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-</div>
-</div>
-</div>
-
- </div>
-
-</body></html>
132 experiments/api-viewer/docs/after/index.html
View
@@ -1,132 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.after()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="after1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.after( content )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Insert content, specified by the parameter, after each element in the set of matched elements.</p>
-<ul class="signatures">
-<li class="signature" id="after-content">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.after( content )</h4>
-<p class="arguement"><strong>content</strong>An element, HTML string, or jQuery object to insert after each element in the set of matched elements.</p>
-</li>
-<li class="signature" id="after-functionindex">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.4/">1.4</a></span>.after( function(index) )</h4>
-<p class="arguement"><strong>function(index)</strong>A function that returns an HTML string to insert after each element in the set of matched elements.</p>
-</li>
-</ul>
-<div class="longdesc">
-<p>The <code>.after()</code> and <code><a href="/insertAfter">.insertAfter()</a></code> methods perform the same task. The major difference is in the syntax-specifically, in the placement of the content and target. With<code> .after()</code>, the selector expression preceding the method is the container after which the content is inserted. With <code>.insertAfter()</code>, on the other hand, the content precedes the method, either as a selector expression or as markup created on the fly, and it is inserted after the target container.</p>
-<p>Consider the following HTML:</p>
-<pre>&lt;div class="container"&gt;
- &lt;h2&gt;Greetings&lt;/h2&gt;
- &lt;div class="inner"&gt;Hello&lt;/div&gt;
- &lt;div class="inner"&gt;Goodbye&lt;/div&gt;
-&lt;/div&gt;</pre>
-<p>We can create content and insert it after several elements at once:</p>
-<pre>$('.inner').after('&lt;p&gt;Test&lt;/p&gt;');</pre>
-<p>Each inner <code>&lt;div&gt;</code> element gets this new content:</p>
-<pre>&lt;div class="container"&gt;
- &lt;h2&gt;Greetings&lt;/h2&gt;
- &lt;div class="inner"&gt;Hello&lt;/div&gt;
- &lt;p&gt;Test&lt;/p&gt;
- &lt;div class="inner"&gt;Goodbye&lt;/div&gt;
- &lt;p&gt;Test&lt;/p&gt;
-&lt;/div&gt;</pre>
-<p>We can also select an element on the page and insert it after another:</p>
-<pre>$('.container').after($('h2'));</pre>
-<p>If an element selected this way is inserted elsewhere, it will be moved after the target (not cloned):</p>
-<pre>&lt;div class="container"&gt;
- &lt;div class="inner"&gt;Hello&lt;/div&gt;
- &lt;div class="inner"&gt;Goodbye&lt;/div&gt;
-&lt;/div&gt;
-&lt;h2&gt;Greetings&lt;/h2&gt;</pre>
-<p>If there is more than one target element, however, cloned copies of the inserted element will be created for each target after the first.</p>
-<p>As of jQuery 1.4, <code>.before()</code> and <code>.after()</code> will also work on disconnected DOM nodes. For example, given the following code:</p>
-<pre>$('&lt;div/&gt;').after('&lt;p&gt;&lt;/p&gt;');</pre>
-<p>The result is a jQuery set containing a div and a paragraph, in that order. We can further manipulate that set, even before inserting it in the document.</p>
-<pre>$('&lt;div/&gt;').after('&lt;p&gt;&lt;/p&gt;').addClass('foo')
- .filter('p').attr('id', 'bar').html('hello')
-.end()
-.appendTo('body');</pre>
-<p>This results in the following elements inserted just before the closing <code>&lt;/body&gt;</code> tag:</p>
-<pre>
-&lt;div class="foo"&gt;&lt;/div&gt;
-&lt;p class="foo" id="bar"&gt;hello&lt;/p&gt;
-</pre>
-<p>As of jQuery 1.4, <code>.after()</code> allows us to pass a function that returns the elements to insert.</p>
-<pre>$('p').after(function() {
- return '&lt;div&gt;' + this.className + '&lt;/div&gt;';
-});</pre>
-<p>This inserts a <code>&lt;div&gt;</code> after each paragraph, containing the class name(s) of each paragraph in turn.</p>
-</div>
-<h3>Examples:</h3>
-<div id="entry-examples" class="entry-examples">
-<div id="example-0">
-<h4>Example: <span class="desc">Inserts some HTML after all paragraphs.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;p { background:yellow; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;I would like to say: &lt;/p&gt;
-&lt;script&gt;$("p").after("&lt;b&gt;Hello&lt;/b&gt;");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-1">
-<h4>Example: <span class="desc">Inserts a DOM element after all paragraphs.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;p { background:yellow; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;I would like to say: &lt;/p&gt;
-&lt;script&gt;$("p").after( document.createTextNode("Hello") );&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-2">
-<h4>Example: <span class="desc">Inserts a jQuery object (similar to an Array of DOM Elements) after all paragraphs.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;p { background:yellow; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;b&gt;Hello&lt;/b&gt;&lt;p&gt;I would like to say: &lt;/p&gt;
-&lt;script&gt;$("p").after( $("b") );&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-</div>
-</div>
-</div>
-
- </div>
-
-</body></html>
58 experiments/api-viewer/docs/ajaxComplete/index.html
View
@@ -1,58 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.ajaxComplete()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="ajaxComplete1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.ajaxComplete( handler(event, XMLHttpRequest, ajaxOptions) )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Register a handler to be called when Ajax requests complete. This is an Ajax Event.</p>
-<ul class="signatures"><li class="signature" id="ajaxComplete-handlerevent, XMLHttpRequest, ajaxOptions">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.ajaxComplete( handler(event, XMLHttpRequest, ajaxOptions) )</h4>
-<p class="arguement"><strong>handler(event, XMLHttpRequest, ajaxOptions)</strong>The function to be invoked.</p>
-</li></ul>
-<div class="longdesc">
-<p>Whenever an Ajax request completes, jQuery triggers the <code>ajaxComplete</code> event. Any and all handlers that have been registered with the <code>.ajaxComplete()</code> method are executed at this time.</p>
-<p>To observe this method in action, we can set up a basic Ajax load request:</p>
-<pre>&lt;div class="trigger"&gt;Trigger&lt;/div&gt;
-&lt;div class="result"&gt;&lt;/div&gt;
-&lt;div class="log"&gt;&lt;/div&gt;
-</pre>
-<p>We can attach our event handler to any element:</p>
-<pre>$('.log').ajaxComplete(function() {
- $(this).text('Triggered ajaxComplete handler.');
-});
-</pre>
-<p>Now, we can make an Ajax request using any jQuery method:</p>
-<pre>$('.trigger').click(function() {
- $('.result').load('ajax/test.html');
-});</pre>
-<p>When the user clicks the button and the Ajax request completes, the log message is displayed.</p>
-<p><strong>Note:</strong> Because <code>.ajaxComplete()</code> is implemented as a method of jQuery object instances, we can use the <code>this</code> keyword as we do here to refer to the selected elements within the callback function.</p>
-<p>All <code>ajaxComplete</code> handlers are invoked, regardless of what Ajax request was completed. If we must differentiate between the requests, we can use the parameters passed to the handler. Each time an <code>ajaxComplete</code> handler is executed, it is passed the event object, the <code>XMLHttpRequest</code> object, and the settings object that was used in the creation of the request. For example, we can restrict our callback to only handling events dealing with a particular URL:</p>
-<pre>$('.log').ajaxComplete(function(e, xhr, settings) {
- if (settings.url == 'ajax/test.html') {
- $(this).text('Triggered ajaxComplete handler.');
- }
-});</pre>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Show a message when an Ajax request completes.</span></h4>
-<pre><code class="example">$("#msg").ajaxComplete(function(event,request, settings){
- $(this).append("&lt;li&gt;Request Complete.&lt;/li&gt;");
- });</code></pre>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
56 experiments/api-viewer/docs/ajaxError/index.html
View
@@ -1,56 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.ajaxError()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="ajaxError1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.ajaxError( handler(event, XMLHttpRequest, ajaxOptions, thrownError) )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Register a handler to be called when Ajax requests complete with an error. This is an Ajax Event.</p>
-<ul class="signatures"><li class="signature" id="ajaxError-handlerevent, XMLHttpRequest, ajaxOptions, thrownError">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.ajaxError( handler(event, XMLHttpRequest, ajaxOptions, thrownError) )</h4>
-<p class="arguement"><strong>handler(event, XMLHttpRequest, ajaxOptions, thrownError)</strong>The function to be invoked.</p>
-</li></ul>
-<div class="longdesc">
-<p>Whenever an Ajax request completes with an error, jQuery triggers the <code>ajaxError</code> event. Any and all handlers that have been registered with the <code>.ajaxError()</code> method are executed at this time.</p>
-<p>To observe this method in action, we can set up a basic Ajax load request:</p>
-<pre>&lt;div class="trigger"&gt;Trigger&lt;/div&gt;
-&lt;div class="result"&gt;&lt;/div&gt;
-&lt;div class="log"&gt;&lt;/div&gt;</pre>
-<p>We can attach our event handler to any element:</p>
-<pre>$('.log').ajaxError(function() {
- $(this).text('Triggered ajaxError handler.');
-});</pre>
-<p>Now, we can make an Ajax request using any jQuery method:</p>
-<pre>$('.trigger').click(function() {
- $('.result').load('ajax/missing.html');
-});</pre>
-<p>When the user clicks the button and the Ajax request fails, because the requested file is missing, the log message is displayed.</p>
-<p><strong>Note:</strong> Because <code>.ajaxError()</code> is implemented as a method of jQuery object instances, we can use the <code>this</code> keyword as we do here to refer to the selected elements within the callback function.</p>
-<p>All <code>ajaxError</code> handlers are invoked, regardless of what Ajax request was completed. If we must differentiate between the requests, we can use the parameters passed to the handler. Each time an <code>ajaxError</code> handler is executed, it is passed the event object, the <code>XMLHttpRequest</code> object, and the settings object that was used in the creation of the request. If the request failed because JavaScript raised an exception, the exception object is passed to the handler as a fourth parameter. For example, we can restrict our callback to only handling events dealing with a particular URL:</p>
-<pre>$('.log').ajaxError(function(e, xhr, settings, exception) {
- if (settings.url == 'ajax/missing.html') {
- $(this).text('Triggered ajaxError handler.');
- }
-});</pre>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Show a message when an Ajax request fails.</span></h4>
-<pre><code class="example">$("#msg").ajaxError(function(event, request, settings){
- $(this).append("&lt;li&gt;Error requesting page " + settings.url + "&lt;/li&gt;");
- });</code></pre>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
56 experiments/api-viewer/docs/ajaxSend/index.html
View
@@ -1,56 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.ajaxSend()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="ajaxSend1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.ajaxSend( handler(event, XMLHttpRequest, ajaxOptions) )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong></p>
-<ul class="signatures"><li class="signature" id="ajaxSend-handlerevent, XMLHttpRequest, ajaxOptions">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.ajaxSend( handler(event, XMLHttpRequest, ajaxOptions) )</h4>
-<p class="arguement"><strong>handler(event, XMLHttpRequest, ajaxOptions)</strong>The function to be invoked.</p>
-</li></ul>
-<div class="longdesc">
-<p>Whenever an Ajax request is about to be sent, jQuery triggers the <code>ajaxSend</code> event. Any and all handlers that have been registered with the <code>.ajaxSend()</code> method are executed at this time.</p>
-<p>To observe this method in action, we can set up a basic Ajax load request:</p>
-<pre>&lt;div class="trigger"&gt;Trigger&lt;/div&gt;
-&lt;div class="result"&gt;&lt;/div&gt;
-&lt;div class="log"&gt;&lt;/div&gt;</pre>
-<p>We can attach our event handler to any element:</p>
-<pre>$('.log').ajaxSend(function() {
- $(this).text('Triggered ajaxSend handler.');
-});</pre>
-<p>Now, we can make an Ajax request using any jQuery method:</p>
-<pre>$('.trigger').click(function() {
- $('.result').load('ajax/test.html');
-});</pre>
-<p>When the user clicks the button and the Ajax request is about to begin, the log message is displayed.</p>
-<p><strong>Note:</strong> Because <code>.ajaxSend()</code> is implemented as a method of jQuery instances, we can use the <code>this</code> keyword as we do here to refer to the selected elements within the callback function.</p>
-<p>All <code>ajaxSend</code> handlers are invoked, regardless of what Ajax request is to be sent. If we must differentiate between the requests, we can use the parameters passed to the handler. Each time an <code>ajaxSend</code> handler is executed, it is passed the event object, the <code>XMLHttpRequest</code> object, and the <a href="http://api.jquery.com/jQuery.ajax/">settings object</a> that was used in the creation of the Ajax request. For example, we can restrict our callback to only handling events dealing with a particular URL:</p>
-<pre>$('.log').ajaxSend(function(e, xhr, settings) {
- if (settings.url == 'ajax/test.html') {
- $(this).text('Triggered ajaxSend handler.');
- }
-});</pre>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Show a message before an Ajax request is sent.</span></h4>
-<pre><code class="example">$("#msg").ajaxSend(function(evt, request, settings){
- $(this).append("&lt;li&gt;Starting request at " + settings.url + "&lt;/li&gt;");
- });</code></pre>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
50 experiments/api-viewer/docs/ajaxStart/index.html
View
@@ -1,50 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.ajaxStart()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="ajaxStart1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.ajaxStart( handler() )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Register a handler to be called when the first Ajax request begins. This is an Ajax Event.</p>
-<ul class="signatures"><li class="signature" id="ajaxStart-handler">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.ajaxStart( handler() )</h4>
-<p class="arguement"><strong>handler()</strong>The function to be invoked.</p>
-</li></ul>
-<div class="longdesc">
-<p>Whenever an Ajax request is about to be sent, jQuery checks whether there are any other outstanding Ajax requests. If none are in progress, jQuery triggers the <code>ajaxStart</code> event. Any and all handlers that have been registered with the <code>.ajaxStart()</code> method are executed at this time.</p>
-<p>To observe this method in action, we can set up a basic Ajax load request:</p>
-<pre>&lt;div class="trigger"&gt;Trigger&lt;/div&gt;
-&lt;div class="result"&gt;&lt;/div&gt;
-&lt;div class="log"&gt;&lt;/div&gt;</pre>
-<p>We can attach our event handler to any element:</p>
-<pre>$('.log').ajaxStart(function() {
- $(this).text('Triggered ajaxStart handler.');
-});</pre>
-<p>Now, we can make an Ajax request using any jQuery method:</p>
-<pre>$('.trigger').click(function() {
- $('.result').load('ajax/test.html');
-});</pre>
-<p>When the user clicks the button and the Ajax request is sent, the log message is displayed.</p>
-<p><strong>Note:</strong> Because <code>.ajaxStart()</code> is implemented as a method of jQuery object instances, we can use the <code>this</code> keyword as we do here to refer to the selected elements within the callback function.</p>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Show a loading message whenever an Ajax request starts (and none is already active).</span></h4>
-<pre><code class="example">$("#loading").ajaxStart(function(){
- $(this).show();
- });</code></pre>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
50 experiments/api-viewer/docs/ajaxStop/index.html
View
@@ -1,50 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.ajaxStop()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="ajaxStop1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.ajaxStop( handler() )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong></p>
-<ul class="signatures"><li class="signature" id="ajaxStop-handler">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.ajaxStop( handler() )</h4>
-<p class="arguement"><strong>handler()</strong>The function to be invoked.</p>
-</li></ul>
-<div class="longdesc">
-<p>Whenever an Ajax request completes, jQuery checks whether there are any other outstanding Ajax requests. If none remain, jQuery triggers the <code>ajaxStop</code> event. Any and all handlers that have been registered with the <code>.ajaxStop()</code> method are executed at this time.</p>
-<p>To observe this method in action, we can set up a basic Ajax load request:</p>
-<pre>&lt;div class="trigger"&gt;Trigger&lt;/div&gt;
-&lt;div class="result"&gt;&lt;/div&gt;
-&lt;div class="log"&gt;&lt;/div&gt;</pre>
-<p>We can attach our event handler to any element:</p>
-<pre>$('.log').ajaxStop(function() {
- $(this).text('Triggered ajaxStop handler.');
-});</pre>
-<p>Now, we can make an Ajax request using any jQuery method:</p>
-<pre>$('.trigger').click(function() {
- $('.result').load('ajax/test.html');
-});</pre>
-<p>When the user clicks the button and the Ajax request completes, the log message is displayed.</p>
-<p>Because <code>.ajaxStop()</code> is implemented as a method of jQuery object instances, we can use the <code>this</code> keyword as we do here to refer to the selected elements within the callback function.</p>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Hide a loading message after all the Ajax requests have stopped.</span></h4>
-<pre><code class="example">$("#loading").ajaxStop(function(){
- $(this).hide();
- });</code></pre>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
56 experiments/api-viewer/docs/ajaxSuccess/index.html
View
@@ -1,56 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.ajaxSuccess()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="ajaxSuccess1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.ajaxSuccess( handler(event, XMLHttpRequest, ajaxOptions) )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong></p>
-<ul class="signatures"><li class="signature" id="ajaxSuccess-handlerevent, XMLHttpRequest, ajaxOptions">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.ajaxSuccess( handler(event, XMLHttpRequest, ajaxOptions) )</h4>
-<p class="arguement"><strong>handler(event, XMLHttpRequest, ajaxOptions)</strong>The function to be invoked.</p>
-</li></ul>
-<div class="longdesc">
-<p>Whenever an Ajax request completes successfully, jQuery triggers the <code>ajaxSuccess</code> event. Any and all handlers that have been registered with the <code>.ajaxSuccess()</code> method are executed at this time.</p>
-<p>To observe this method in action, we can set up a basic Ajax load request:</p>
-<pre>&lt;div class="trigger"&gt;Trigger&lt;/div&gt;
-&lt;div class="result"&gt;&lt;/div&gt;
-&lt;div class="log"&gt;&lt;/div&gt;</pre>
-<p>We can attach our event handler to any element:</p>
-<pre>$('.log').ajaxSuccess(function() {
- $(this).text('Triggered ajaxSuccess handler.');
-});</pre>
-<p>Now, we can make an Ajax request using any jQuery method:</p>
-<pre>$('.trigger').click(function() {
- $('.result').load('ajax/test.html');
-});</pre>
-<p>When the user clicks the button and the Ajax request completes successfully, the log message is displayed.</p>
-<p><strong>Note:</strong> Because <code>.ajaxSuccess()</code> is implemented as a method of jQuery object instances, we can use the <code>this</code> keyword as we do here to refer to the selected elements within the callback function.</p>
-<p>All <code>ajaxSuccess</code> handlers are invoked, regardless of what Ajax request was completed. If we must differentiate between the requests, we can use the parameters passed to the handler. Each time an <code>ajaxSuccess</code> handler is executed, it is passed the event object, the <code>XMLHttpRequest</code> object, and the settings object that was used in the creation of the request. For example, we can restrict our callback to only handling events dealing with a particular URL:</p>
-<pre>$('.log').ajaxSuccess(function(e, xhr, settings) {
- if (settings.url == 'ajax/test.html') {
- $(this).text('Triggered ajaxSuccess handler.');
- }
-});</pre>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Show a message when an Ajax request completes successfully.</span></h4>
-<pre><code class="example">$("#msg").ajaxSuccess(function(evt, request, settings){
- $(this).append("&lt;li&gt;Successful Request!&lt;/li&gt;");
- });</code></pre>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
96 experiments/api-viewer/docs/all-selector/index.html
View
@@ -1,96 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div class="ui-page">
- <div data-role="header">
- <h1>All Selector (“*”)</h1>
- <div class="entry-meta">Categories:
- <span class="category"><a href="http://api.jquery.com/category/selectors/" title="View all posts in Selectors">Selectors</a> &gt; <a href="http://api.jquery.com/category/selectors/basic-css-selectors/" title="View all posts in Basic">Basic</a></span>
-
- </div>
-</div>
-<div data-role="content" data-theme="c" id="all1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">all</span> selector</h2>
-<div class=" entry-details">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/version/1.0/">1.0</a></span>jQuery('*')</h4>
-<p class="desc"><strong>Description: </strong>Selects all elements.</p>
-<div class="longdesc"><p>Caution: The all, or universal, selector is extremely slow, except when used by itself.</p></div>
-<h3>Examples:</h3>
-<div id="entry-examples" class="entry-examples">
-<div id="example-0">
-<h4>Example: <span class="desc">Finds every element (including head, body, etc) in the document.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
- h3 { margin: 0; }
- div,span,p {
- width: 80px;
- height: 40px;
- float:left;
- padding: 10px;
- margin: 10px;
- background-color: #EEEEEE;
- }
- &lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;div&gt;DIV&lt;/div&gt;
-
- &lt;span&gt;SPAN&lt;/span&gt;
- &lt;p&gt;P &lt;button&gt;Button&lt;/button&gt;&lt;/p&gt;
-&lt;script&gt;var elementCount = $("*").css("border","3px solid red").length;
-$("body").prepend("&lt;h3&gt;" + elementCount + " elements found&lt;/h3&gt;");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-1">
-<h4>Example: <span class="desc">A common way to select all elements is to find within document.body so elements like head, script, etc are left out.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
- h3 { margin: 0; }
- div,span,p {
- width: 80px;
- height: 40px;
- float:left;
- padding: 10px;
- margin: 10px;
- background-color: #EEEEEE;
- }
- #test {
- width: auto; height: auto; background-color: transparent;
- }
- &lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;div id="test"&gt;
- &lt;div&gt;DIV&lt;/div&gt;
- &lt;span&gt;SPAN&lt;/span&gt;
- &lt;p&gt;P &lt;button&gt;Button&lt;/button&gt;&lt;/p&gt;
-&lt;/div&gt;
-&lt;script&gt;
-var elementCount = $("#test").find("*").css("border","3px solid red").length;
-$("body").prepend("&lt;h3&gt;" + elementCount + " elements found&lt;/h3&gt;");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-</div>
-</div>
-</div>
-
- </div>
-
-</body></html>
69 experiments/api-viewer/docs/andSelf/index.html
View
@@ -1,69 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.andSelf()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="andSelf1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.andSelf()</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Add the previous set of elements on the stack to the current set.</p>
-<ul class="signatures"><li class="signature" id="andSelf"><h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.2/">1.2</a></span>.andSelf()</h4></li></ul>
-<div class="longdesc">
-<p>As described in the discussion for <code>.end()</code> above, jQuery objects maintain an internal stack that keeps track of changes to the matched set of elements. When one of the DOM traversal methods is called, the new set of elements is pushed onto the stack. If the previous set of elements is desired as well, <code>.andSelf()</code> can help.</p>
-<p>Consider a page with a simple list on it:</p>
-<pre>
-&lt;ul&gt;
- &lt;li&gt;list item 1&lt;/li&gt;
- &lt;li&gt;list item 2&lt;/li&gt;
- &lt;li class="third-item"&gt;list item 3&lt;/li&gt;
- &lt;li&gt;list item 4&lt;/li&gt;
- &lt;li&gt;list item 5&lt;/li&gt;
-&lt;/ul&gt;
-</pre>
-<p>If we begin at the third item, we can find the elements which come after it:</p>
-<pre>$('li.third-item').nextAll().andSelf()
- .css('background-color', 'red');
-</pre>
-<p>The result of this call is a red background behind items 3, 4 and 5. First, the initial selector locates item 3, initializing the stack with the set containing just this item. The call to <code>.nextAll()</code> then pushes the set of items 4 and 5 onto the stack. Finally, the <code>.andSelf()</code> invocation merges these two sets together, creating a jQuery object that points to all three items.</p>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Find all divs, and all the paragraphs inside of them, and give them both classnames. Notice the div doesn't have the yellow background color since it didn't use andSelf.</span></h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
- p, div { margin:5px; padding:5px; }
- .border { border: 2px solid red; }
- .background { background:yellow; }
- &lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;div&gt;
- &lt;p&gt;First Paragraph&lt;/p&gt;
- &lt;p&gt;Second Paragraph&lt;/p&gt;
- &lt;/div&gt;
-&lt;script&gt;
- $("div").find("p").andSelf().addClass("border");
- $("div").find("p").addClass("background");
-
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
311 experiments/api-viewer/docs/animate/index.html
View
@@ -1,311 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div class="ui-page">
- <div data-role="header">
- <h1>.animate()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="animate1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.animate( properties, [ duration ], [ easing ], [ callback ] )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Perform a custom animation of a set of CSS properties.</p>
-<ul class="signatures">
-<li class="signature" id="animate-properties-duration-easing-callback">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.animate( properties, [ duration ], [ easing ], [ callback ] )</h4>
-<p class="arguement"><strong>properties</strong>A map of CSS properties that the animation will move toward.</p>
-<p class="arguement"><strong>duration</strong>A string or number determining how long the animation will run.</p>
-<p class="arguement"><strong>easing</strong>A string indicating which easing function to use for the transition.</p>
-<p class="arguement"><strong>callback</strong>A function to call once the animation is complete.</p>
-</li>
-<li class="signature" id="animate-properties-options">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.animate( properties, options )</h4>
-<p class="arguement"><strong>properties</strong>A map of CSS properties that the animation will move toward.</p>
-<p class="arguement"><strong>options</strong>A map of additional options to pass to the method. Supported keys:
- </p>
-<ul>
-<li>
-<code>duration</code>: A string or number determining how long the animation will run.</li>
- <li>
-<code>easing</code>: A string indicating which easing function to use for the transition.</li>
- <li>
-<code>complete</code>: A function to call once the animation is complete.</li>
- <li>
-<code>step</code>: A function to be called after each step of the animation.</li>
- <li>
-<code>queue</code>: A Boolean indicating whether to place the animation in the effects queue. If <code>false</code>, the animation will begin immediately.</li>
- <li>
-<code>specialEasing</code>: A map of one or more of the CSS properties defined by the properties argument and their corresponding easing functions (added 1.4).</li>
- </ul>
-</li>
-</ul>
-<div class="longdesc">
-<p>The <code>.animate()</code> method allows us to create animation effects on any numeric CSS property. The only required parameter is a map of CSS properties. This map is similar to the one that can be sent to the <code>.css()</code> method, except that the range of properties is more restrictive.</p>
-<p>All animated properties should be numeric (except as noted below); properties that are non-numeric cannot be animated using basic jQuery functionality. (For example, <code>width</code>, <code>height</code>, or <code>left</code> can be animated but <code>background-color</code> cannot be.) Property values are treated as a number of pixels unless otherwise specified. The units <code>em</code> and <code>%</code> can be specified where applicable.</p>
-<p>In addition to numeric values, each property can take the strings <code>'show'</code>, <code>'hide'</code>, and <code>'toggle'</code>. These shortcuts allow for custom hiding and showing animations that take into account the display type of the element.</p>
-<p>Animated properties can also be relative. If a value is supplied with a leading <code>+=</code> or <code>-=</code> sequence of characters, then the target value is computed by adding or subtracting the given number from the current value of the property.</p>
-<h4 id="duration">Duration</h4>
-<p>Durations are given in milliseconds; higher values indicate slower animations, not faster ones. The strings <code>'fast'</code> and <code>'slow'</code> can be supplied to indicate durations of <code>200</code> and <code>600</code> milliseconds, respectively.</p>
-<h4 id="callback">Callback Function</h4>
-<p>If supplied, the callback is fired once the animation is complete. This can be useful for stringing different animations together in sequence. The callback is not sent any arguments, but <code>this</code> is set to the DOM element being animated. If multiple elements are animated, it is important to note that the callback is executed once per matched element, not once for the animation as a whole.</p>
-<p>We can animate any element, such as a simple image:</p>
-<pre>&lt;div id="clickme"&gt;
- Click here
-&lt;/div&gt;
-&lt;img id="book" src="book.png" alt="" width="100" height="123"
- style="position: relative; left: 10px;" /&gt;</pre>
-<p>We can animate the opacity, left offset, and height of the image simultaneously:</p>
-<pre>$('#clickme').click(function() {
- $('#book').animate({
- opacity: 0.25,
- left: '+=50',
- height: 'toggle'
- }, 5000, function() {
- // Animation complete.
- });
-});
-</pre>
-<p class="image">
- <img src="http://api.jquery.com/images/animate-1.jpg" alt=""></p>
-<p>Note that we have specified <code>toggle</code> as the target value of the <code>height</code> property. Since the image was visible before, the animation shrinks the height to 0 to hide it. A second click then reverses this transition:
-</p>
-<p class="image">
-<img src="http://api.jquery.com/images/animate-2.jpg" alt=""></p>
-<p>The <code>opacity</code> of the image is already at its target value, so this property is not animated by the second click. Since we specified the target value for <code>left</code> as a relative value, the image moves even farther to the right during this second animation.</p>
-<p>The <code>position</code> attribute of the element must not be <code>static</code> if we wish to animate the <code>left</code> property as we do in the example.</p>
-<blockquote><p>The <a href="http://jqueryui.com">jQuery UI</a> project extends the <code>.animate()</code> method by allowing some non-numeric styles such as colors to be animated. The project also includes mechanisms for specifying animations through CSS classes rather than individual attributes.</p></blockquote>
-<h4 id="easing">Easing</h4>
-<p>The remaining parameter of <code>.animate()</code> is a string naming an easing function to use. An easing function specifies the speed at which the animation progresses at different points within the animation. The only easing implementations in the jQuery library are the default, called <code>swing</code>, and one that progresses at a constant pace, called <code>linear</code>. More easing functions are available with the use of plug-ins, most notably the <a href="http://jqueryui.com/">jQuery UI suite</a>.</p>
-<h4 id="per-property-easing">Per-property Easing</h4>
-<p>As of jQuery version 1.4, we can set per-property easing functions within a single <code>.animate()</code> call. In the first version of <code>.animate()</code>, each property can take an array as its value: The first member of the array is the CSS property and the second member is an easing function. If a per-property easing function is not defined for a particular property, it uses the value of the <code>.animate()</code> method's optional easing argument. If the easing argument is not defined, the default <code>swing</code> function is used.</p>
-<p>We can, for example, simultaneously animate the width and height with the <code>swing</code> easing function and the opacity with the <code>linear</code> easing function:</p>
-<pre>$('#clickme').click(function() {
- $('#book').animate({
- width: ['toggle', 'swing'],
- height: ['toggle', 'swing'],
- opacity: 'toggle'
- }, 5000, 'linear', function() {
- $(this).after('&lt;div&gt;Animation complete.&lt;/div&gt;');
- });
-});</pre>
-<p>In the second version of <code>.animate()</code>, the options map can include the <code>specialEasing</code> property, which is itself a map of CSS properties and their corresponding easing functions. We can simultaneously animate the width using the <code>linear</code> easing function and the height using the <code>easeOutBounce</code> easing function.</p>
-<pre>$('#clickme').click(function() {
- $('#book').animate({
- width: 'toggle',
- height: 'toggle'
- }, {
- duration: 5000,
- specialEasing: {
- width: 'linear',
- height: 'easeOutBounce'
- },
- complete: function() {
- $(this).after('&lt;div&gt;Animation complete.&lt;/div&gt;');
- }
- });
-});</pre>
-<p>As previously noted, a plug-in is required for the <code>easeOutBounce</code> function.</p>
-</div>
-<h3>Examples:</h3>
-<div id="entry-examples" class="entry-examples">
-<div id="example-0">
-<h4>Example: <span class="desc">Click the button to animate the div with a number of different properties.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
-div {
-background-color:#bca;
-width:100px;
-border:1px solid green;
-}
-&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;button id="go"&gt;&amp;raquo; Run&lt;/button&gt;
-
-&lt;div id="block"&gt;Hello!&lt;/div&gt;
-&lt;script&gt;
-
-// Using multiple unit types within one animation.
-$("#go").click(function(){
- $("#block").animate({
- width: "70%",
- opacity: 0.4,
- marginLeft: "0.6in",
- fontSize: "3em",
- borderWidth: "10px"
- }, 1500 );
-});
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-1">
-<h4>Example: <span class="desc">Shows a div animate with a relative move. Click several times on the buttons to see the relative animations queued up.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
-div {
-position:absolute;
-background-color:#abc;
-left:50px;
-width:90px;
-height:90px;
-margin:5px;
-}
-&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;button id="left"&gt;&amp;laquo;&lt;/button&gt; &lt;button id="right"&gt;&amp;raquo;&lt;/button&gt;
-&lt;div class="block"&gt;&lt;/div&gt;
-
-&lt;script&gt;
-$("#right").click(function(){
- $(".block").animate({"left": "+=50px"}, "slow");
-});
-
-$("#left").click(function(){
- $(".block").animate({"left": "-=50px"}, "slow");
-});
-
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-2">
-<h4>Example: <span class="desc">Animates all paragraphs to toggle both height and opacity, completing the animation within 600 milliseconds.</span>
-</h4>
-<pre><code class="example">$("p").animate({
- "height": "toggle", "opacity": "toggle"
-
-}, "slow");</code></pre>
-</div>
-<div id="example-3">
-<h4>Example: <span class="desc">Animates all paragraph to a left style of 50 and opacity of 1 (opaque, visible), completing the animation within 500 milliseconds.</span>
-</h4>
-<pre><code class="example">$("p").animate({
- "left": "50", "opacity": 1
-}, 500);
-</code></pre>
-</div>
-<div id="example-4">
-<h4>Example: <span class="desc">An example of using an 'easing' function to provide a different style of animation. This will only work if you have a plugin that provides this easing function. Note, this code will do nothing unless the paragraph element is hidden.</span>
-</h4>
-<pre><code class="example">$("p").animate({
- "opacity": "show"
-
-}, "slow", "easein");</code></pre>
-</div>
-<div id="example-5">
-<h4>Example: <span class="desc">The first button shows how an unqueued animation works. It expands the div out to 90% width while the font-size is increasing. Once the font-size change is complete, the border animation will begin.
-
-The second button starts a traditional chained animation, where each animation will start once the previous animation on the element has completed.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;div {
- background-color:#bca;
- width:200px;
- height:1.1em;
- text-align:center;
- border:2px solid green;
- margin:3px;
- font-size:14px;
-}
-button {
- font-size:14px;
-}
-&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;button id="go1"&gt;&amp;raquo; Animate Block1&lt;/button&gt;
-&lt;button id="go2"&gt;&amp;raquo; Animate Block2&lt;/button&gt;
-&lt;button id="go3"&gt;&amp;raquo; Animate Both&lt;/button&gt;
-
-&lt;button id="go4"&gt;&amp;raquo; Reset&lt;/button&gt;
-&lt;div id="block1"&gt;Block1&lt;/div&gt;
-&lt;div id="block2"&gt;Block2&lt;/div&gt;
-&lt;script&gt;
-
-$("#go1").click(function(){
- $("#block1").animate( { width:"90%" }, { queue:false, duration:3000 } )
- .animate( { fontSize:"24px" }, 1500 )
- .animate( { borderRightWidth:"15px" }, 1500);
-});
-
-$("#go2").click(function(){
- $("#block2").animate( { width:"90%"}, 1000 )
- .animate( { fontSize:"24px" } , 1000 )
- .animate( { borderLeftWidth:"15px" }, 1000);
-});
-
-$("#go3").click(function(){
- $("#go1").add("#go2").click();
-});
-
-$("#go4").click(function(){
- $("div").css({width:"", fontSize:"", borderWidth:""});
-});
-
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-6">
-<h4>Example: <span class="desc">Animates all paragraphs to toggle both height and opacity, completing the animation within 600 milliseconds.</span>
-</h4>
-<pre><code class="example">$("p").animate({
-"height": "toggle", "opacity": "toggle"
-
-}, { duration: "slow" });</code></pre>
-</div>
-<div id="example-7">
-<h4>Example: <span class="desc">Animates all paragraph to a left style of 50 and opacity of 1 (opaque, visible), completing the animation within 500 milliseconds. It also will do it outside the queue, meaning it will automatically start without waiting for its turn.</span>
-</h4>
-<pre><code class="example">$("p").animate({
-left: "50px", opacity: 1
-}, { duration: 500, queue: false });</code></pre>
-</div>
-<div id="example-8">
-<h4>Example: <span class="desc">An example of using an 'easing' function to provide a different style of animation. This will only work if you have a plugin that provides this easing function.</span>
-</h4>
-<pre><code class="example">$("p").animate({
-"opacity": "show"
-
-}, { "duration": "slow", "easing": "easein" });</code></pre>
-</div>
-<div id="example-9">
-<h4>Example: <span class="desc">An example of using a callback function. The first argument is an array of CSS properties, the second specifies that the animation should take 1000 milliseconds to complete, the third states the easing type, and the fourth argument is an anonymous callback function. </span>
-</h4>
-<pre><code class="example">$("p").animate({
-height:200, width:400, opacity: .5
-}, 1000, "linear", function(){alert("all done");} );
-
-</code></pre>
-</div>
-</div>
-</div>
-</div>
-
- </div>
-
-</body></html>
55 experiments/api-viewer/docs/animated-selector/index.html
View
@@ -1,55 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>:animated Selector</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="animated1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">animated</span> selector</h2>
-<div class=" entry-details">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/version/1.2/">1.2</a></span>jQuery(':animated')</h4>
-<p class="desc"><strong>Description: </strong>Select all elements that are in the progress of an animation at the time the selector is run.</p>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Change the color of any div that is animated.</span></h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;
- div { background:yellow; border:1px solid #AAA; width:80px; height:80px; margin:5px; float:left; }
- div.colored { background:green; }
- &lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;button id="run"&gt;Run&lt;/button&gt;
-
- &lt;div&gt;&lt;/div&gt;
- &lt;div id="mover"&gt;&lt;/div&gt;
- &lt;div&gt;&lt;/div&gt;
-&lt;script&gt;
-
- $("#run").click(function(){
- $("div:animated").toggleClass("colored");
- });
- function animateIt() {
- $("#mover").slideToggle("slow", animateIt);
- }
- animateIt();
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
124 experiments/api-viewer/docs/append/index.html
View
@@ -1,124 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.append()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="append1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.append( content )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Insert content, specified by the parameter, to the end of each element in the set of matched elements.</p>
-<ul class="signatures">
-<li class="signature" id="append-content">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.append( content )</h4>
-<p class="arguement"><strong>content</strong>An element, HTML string, or jQuery object to insert at the end of each element in the set of matched elements.</p>
-</li>
-<li class="signature" id="append-functionindex, html">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.4/">1.4</a></span>.append( function(index, html) )</h4>
-<p class="arguement"><strong>function(index, html)</strong>A function that returns an HTML string to insert at the end of each element in the set of matched elements. Receives the index position of the element in the set and the old HTML value of the element as arguments.</p>
-</li>
-</ul>
-<div class="longdesc">
-<p>The <code>.append()</code> and <code><a href="/appendTo">.appendTo()</a></code> methods perform the same task. The major difference is in the syntax-specifically, in the placement of the content and target. With<code> .append()</code>, the selector expression preceding the method is the container into which the content is inserted. With <code>.appendTo()</code>, on the other hand, the content precedes the method, either as a selector expression or as markup created on the fly, and it is inserted into the target container.</p>
-<p>Consider the following HTML:</p>
-<pre>&lt;h2&gt;Greetings&lt;/h2&gt;
-&lt;div class="container"&gt;
- &lt;div class="inner"&gt;Hello&lt;/div&gt;
- &lt;div class="inner"&gt;Goodbye&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-<p>We can create content and insert it into several elements at once:</p>
-<pre>$('.inner').append('&lt;p&gt;Test&lt;/p&gt;');
-</pre>
-<p>Each inner <code>&lt;div&gt;</code> element gets this new content:</p>
-<pre>&lt;h2&gt;Greetings&lt;/h2&gt;
-&lt;div class="container"&gt;
- &lt;div class="inner"&gt;
- Hello
- &lt;p&gt;Test&lt;/p&gt;
- &lt;/div&gt;
- &lt;div class="inner"&gt;
- Goodbye
- &lt;p&gt;Test&lt;/p&gt;
- &lt;/div&gt;
-&lt;/div&gt;
-</pre>
-<p>We can also select an element on the page and insert it into another:</p>
-<pre>$('.container').append($('h2'));
-</pre>
-<p>If an element selected this way is inserted elsewhere, it will be moved into the target (not cloned):</p>
-<pre>&lt;div class="container"&gt;
- &lt;div class="inner"&gt;Hello&lt;/div&gt;
- &lt;div class="inner"&gt;Goodbye&lt;/div&gt;
- &lt;h2&gt;Greetings&lt;/h2&gt;
-&lt;/div&gt;
-</pre>
-<p>If there is more than one target element, however, cloned copies of the inserted element will be created for each target after the first.</p>
-</div>
-<h3>Examples:</h3>
-<div id="entry-examples" class="entry-examples">
-<div id="example-0">
-<h4>Example: <span class="desc">Appends some HTML to all paragraphs.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;p { background:yellow; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;I would like to say: &lt;/p&gt;
-&lt;script&gt;$("p").append("&lt;strong&gt;Hello&lt;/strong&gt;");&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-1">
-<h4>Example: <span class="desc">Appends an Element to all paragraphs.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;p { background:yellow; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;I would like to say: &lt;/p&gt;
-&lt;script&gt;$("p").append(document.createTextNode("Hello"));&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-<div id="example-2">
-<h4>Example: <span class="desc">Appends a jQuery object (similar to an Array of DOM Elements) to all paragraphs.</span>
-</h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;p { background:yellow; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;strong&gt;Hello world!!!&lt;/strong&gt;&lt;p&gt;I would like to say: &lt;/p&gt;
-&lt;script&gt;$("p").append( $("strong") );&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div>
-</div>
-</div>
-</div>
-
- </div>
-
-</body></html>
82 experiments/api-viewer/docs/appendTo/index.html
View
@@ -1,82 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.appendTo()</h1>
-
-</div>
-<div data-role="content" data-theme="c" id="appendTo1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.appendTo( target )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Insert every element in the set of matched elements to the end of the target.</p>
-<ul class="signatures"><li class="signature" id="appendTo-target">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.appendTo( target )</h4>
-<p class="arguement"><strong>target</strong>A selector, element, HTML string, or jQuery object; the matched set of elements will be inserted at the end of the element(s) specified by this parameter.</p>
-</li></ul>
-<div class="longdesc">
-<p>The <code><a href="/append">.append()</a></code> and <code>.appendTo()</code> methods perform the same task. The major difference is in the syntax-specifically, in the placement of the content and target. With<code> .append()</code>, the selector expression preceding the method is the container into which the content is inserted. With <code>.appendTo()</code>, on the other hand, the content precedes the method, either as a selector expression or as markup created on the fly, and it is inserted into the target container.</p>
-<p>Consider the following HTML:</p>
-<pre>&lt;h2&gt;Greetings&lt;/h2&gt;
-&lt;div class="container"&gt;
- &lt;div class="inner"&gt;Hello&lt;/div&gt;
- &lt;div class="inner"&gt;Goodbye&lt;/div&gt;
-&lt;/div&gt;
-</pre>
-<p>We can create content and insert it into several elements at once:</p>
-<pre>$('&lt;p&gt;Test&lt;/p&gt;').appendTo('.inner');
-</pre>
-<p>Each inner <code>&lt;div&gt;</code> element gets this new content:</p>
-<pre>&lt;h2&gt;Greetings&lt;/h2&gt;
-&lt;div class="container"&gt;
- &lt;div class="inner"&gt;
- Hello
- &lt;p&gt;Test&lt;/p&gt;
- &lt;/div&gt;
- &lt;div class="inner"&gt;
- Goodbye
- &lt;p&gt;Test&lt;/p&gt;
- &lt;/div&gt;
-&lt;/div&gt;
-</pre>
-<p>We can also select an element on the page and insert it into another:</p>
-<pre>$('h2').appendTo($('.container'));
-</pre>
-<p>If an element selected this way is inserted elsewhere, it will be moved into the target (not cloned):</p>
-<pre>&lt;div class="container"&gt;
- &lt;div class="inner"&gt;Hello&lt;/div&gt;
- &lt;div class="inner"&gt;Goodbye&lt;/div&gt;
- &lt;h2&gt;Greetings&lt;/h2&gt;
-&lt;/div&gt;
-</pre>
-<p>If there is more than one target element, however, cloned copies of the inserted element will be created for each target after the first.</p>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Appends all spans to the element with the ID "foo"</span></h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;#foo { background:yellow; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;span&gt;I have nothing more to say... &lt;/span&gt;
-
- &lt;div id="foo"&gt;FOO! &lt;/div&gt;
-&lt;script&gt;$("span").appendTo("#foo"); // check append() examples&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div></div>
-</div>
-</div>
-
- </div>
-
-</body></html>
212 experiments/api-viewer/docs/attr/index.html
View
@@ -1,212 +0,0 @@
-<!DOCTYPE html>
-<html lang='en'><head>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1"><meta http-equiv='content-type' content='text/html; charset=UTF-8' /></head><body>
-<div data-role="page">
- <div data-role="header">
- <h1>.attr()</h1>
-
-</div>
-
-
-<div data-role="content" data-theme="c" id="attr1">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.attr( attributeName )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#String">String</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Get the value of an attribute for the first element in the set of matched elements.</p>
-<ul class="signatures"><li class="signature" id="attr-attributeName">
-<h4 class="name">
-<span class="versionAdded">version added: <a href="/category/version/1.0/">1.0</a></span>.attr( attributeName )</h4>
-<p class="arguement"><strong>attributeName</strong>The name of the attribute to get.</p>
-</li></ul>
-<div class="longdesc">
-<p>It's important to note that the <code>.attr()</code> method gets the attribute value for only the <em>first</em> element in the matched set. To get the value for each element individually, we need to rely on a looping construct such as jQuery's <code>.each()</code> method.</p>
-<p>Using jQuery's <code>.attr()</code> method to get the value of an element's attribute has two main benefits:</p>
-<ol>
-<li>
-<strong>Convenience</strong>: It can be called directly on a jQuery object and chained to other jQuery methods.</li>
- <li>
-<strong>Cross-browser consistency</strong>: Some attributes have inconsistent naming from browser to browser. Furthermore, the values of some attributes are reported inconsistently across browsers, and even across versions of a single browser. The <code>.attr()</code> method reduces such inconsistencies. </li>
- </ol>
-</div>
-<h3>Example:</h3>
-<div id="entry-examples" class="entry-examples"><div id="example-0">
-<h4><span class="desc">Finds the title attribute of the first &lt;em&gt; in the page.</span></h4>
-<pre><code class="example demo-code">&lt;!DOCTYPE html&gt;
-&lt;html&gt;
-&lt;head&gt;
- &lt;style&gt;em { color:blue; font-weight;bold; }
- div { color:red; }&lt;/style&gt;
- &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
-&lt;/head&gt;
-&lt;body&gt;
- &lt;p&gt;
- Once there was a &lt;em title="huge, gigantic"&gt;large&lt;/em&gt; dinosaur...
- &lt;/p&gt;
-
- The title of the emphasis is:&lt;div&gt;&lt;/div&gt;
-&lt;script&gt;var title = $("em").attr("title");
- $("div").text(title);
-&lt;/script&gt;
-&lt;/body&gt;
-&lt;/html&gt;</code></pre>
-<h4>Demo:</h4>
-<div class="demo code-demo"></div>
-</div></div>
-</div>
-</div>
-<div data-role="content" data-theme="c" id="attr2">
-<h2 class="jq-clearfix roundTop section-title">
-<span class="name">.attr( attributeName, value )</span> <span class="returns">Returns: <a class="return" href="http://docs.jquery.com/Types#jQuery">jQuery</a></span>
-</h2>
-<div class=" entry-details">
-<p class="desc"><strong>Description: </strong>Set one or more attributes for the set of matched elements.</p>
-<ul class="signatures">
-<li class="signature" id="attr-attributeName-value">
-<h4 class="name">