offset.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549
  1. (function() {
  2. if ( !jQuery.fn.offset ) {
  3. return;
  4. }
  5. var supportsScroll, supportsFixedPosition,
  6. forceScroll = jQuery("<div/>").css({ width: 2000, height: 2000 }),
  7. checkSupport = function() {
  8. // Only run once
  9. checkSupport = false;
  10. var checkFixed = jQuery("<div/>").css({ position: "fixed", top: "20px" }).appendTo("#qunit-fixture");
  11. // Must append to body because #qunit-fixture is hidden and elements inside it don't have a scrollTop
  12. forceScroll.appendTo("body");
  13. window.scrollTo( 200, 200 );
  14. supportsScroll = document.documentElement.scrollTop || document.body.scrollTop;
  15. forceScroll.detach();
  16. // Safari subtracts parent border width here (which is 5px)
  17. supportsFixedPosition = checkFixed[0].offsetTop === 20 || checkFixed[0].offsetTop === 15;
  18. checkFixed.remove();
  19. };
  20. module("offset", { setup: function(){
  21. if ( typeof checkSupport === "function" ) {
  22. checkSupport();
  23. }
  24. // Force a scroll value on the main window to ensure incorrect results
  25. // if offset is using the scroll offset of the parent window
  26. forceScroll.appendTo("body");
  27. window.scrollTo( 1, 1 );
  28. forceScroll.detach();
  29. }, teardown: moduleTeardown });
  30. /*
  31. Closure-compiler will roll static methods off of the jQuery object and so they will
  32. not be passed with the jQuery object across the windows. To differentiate this, the
  33. testIframe callbacks use the "$" symbol to refer to the jQuery object passed from
  34. the iframe window and the "jQuery" symbol is used to access any static methods.
  35. */
  36. test("empty set", function() {
  37. expect(2);
  38. strictEqual( jQuery().offset(), undefined, "offset() returns undefined for empty set (#11962)" );
  39. strictEqual( jQuery().position(), undefined, "position() returns undefined for empty set (#11962)" );
  40. });
  41. test("object without getBoundingClientRect", function() {
  42. expect(2);
  43. // Simulates a browser without gBCR on elements, we just want to return 0,0
  44. var result = jQuery({ ownerDocument: document }).offset();
  45. equal( result.top, 0, "Check top" );
  46. equal( result.left, 0, "Check left" );
  47. });
  48. test("disconnected node", function() {
  49. expect(2);
  50. var result = jQuery( document.createElement("div") ).offset();
  51. equal( result.top, 0, "Check top" );
  52. equal( result.left, 0, "Check left" );
  53. });
  54. testIframe("offset/absolute", "absolute", function($, iframe) {
  55. expect(4);
  56. var doc = iframe.document,
  57. tests;
  58. // get offset
  59. tests = [
  60. { "id": "#absolute-1", "top": 1, "left": 1 }
  61. ];
  62. jQuery.each( tests, function() {
  63. equal( jQuery( this["id"], doc ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
  64. equal( jQuery( this["id"], doc ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
  65. });
  66. // get position
  67. tests = [
  68. { "id": "#absolute-1", "top": 0, "left": 0 }
  69. ];
  70. jQuery.each( tests, function() {
  71. equal( jQuery( this["id"], doc ).position().top, this["top"], "jQuery('" + this["id"] + "').position().top" );
  72. equal( jQuery( this["id"], doc ).position().left, this["left"], "jQuery('" + this["id"] + "').position().left" );
  73. });
  74. });
  75. testIframe("offset/absolute", "absolute", function( $ ) {
  76. expect(178);
  77. // get offset tests
  78. var tests = [
  79. { "id": "#absolute-1", "top": 1, "left": 1 },
  80. { "id": "#absolute-1-1", "top": 5, "left": 5 },
  81. { "id": "#absolute-1-1-1", "top": 9, "left": 9 },
  82. { "id": "#absolute-2", "top": 20, "left": 20 }
  83. ];
  84. jQuery.each( tests, function() {
  85. equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
  86. equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
  87. });
  88. // get position
  89. tests = [
  90. { "id": "#absolute-1", "top": 0, "left": 0 },
  91. { "id": "#absolute-1-1", "top": 1, "left": 1 },
  92. { "id": "#absolute-1-1-1", "top": 1, "left": 1 },
  93. { "id": "#absolute-2", "top": 19, "left": 19 }
  94. ];
  95. jQuery.each( tests, function() {
  96. equal( $( this["id"] ).position().top, this["top"], "jQuery('" + this["id"] + "').position().top" );
  97. equal( $( this["id"] ).position().left, this["left"], "jQuery('" + this["id"] + "').position().left" );
  98. });
  99. // test #5781
  100. var offset = $( "#positionTest" ).offset({ "top": 10, "left": 10 }).offset();
  101. equal( offset.top, 10, "Setting offset on element with position absolute but 'auto' values." );
  102. equal( offset.left, 10, "Setting offset on element with position absolute but 'auto' values." );
  103. // set offset
  104. tests = [
  105. { "id": "#absolute-2", "top": 30, "left": 30 },
  106. { "id": "#absolute-2", "top": 10, "left": 10 },
  107. { "id": "#absolute-2", "top": -1, "left": -1 },
  108. { "id": "#absolute-2", "top": 19, "left": 19 },
  109. { "id": "#absolute-1-1-1", "top": 15, "left": 15 },
  110. { "id": "#absolute-1-1-1", "top": 5, "left": 5 },
  111. { "id": "#absolute-1-1-1", "top": -1, "left": -1 },
  112. { "id": "#absolute-1-1-1", "top": 9, "left": 9 },
  113. { "id": "#absolute-1-1", "top": 10, "left": 10 },
  114. { "id": "#absolute-1-1", "top": 0, "left": 0 },
  115. { "id": "#absolute-1-1", "top": -1, "left": -1 },
  116. { "id": "#absolute-1-1", "top": 5, "left": 5 },
  117. { "id": "#absolute-1", "top": 2, "left": 2 },
  118. { "id": "#absolute-1", "top": 0, "left": 0 },
  119. { "id": "#absolute-1", "top": -1, "left": -1 },
  120. { "id": "#absolute-1", "top": 1, "left": 1 }
  121. ];
  122. jQuery.each( tests, function() {
  123. $( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
  124. equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
  125. equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
  126. var top = this["top"], left = this["left"];
  127. $( this["id"] ).offset(function(i, val){
  128. equal( val.top, top, "Verify incoming top position." );
  129. equal( val.left, left, "Verify incoming top position." );
  130. return { "top": top + 1, "left": left + 1 };
  131. });
  132. equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + " })" );
  133. equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + " })" );
  134. $( this["id"] )
  135. .offset({ "left": this["left"] + 2 })
  136. .offset({ "top": this["top"] + 2 });
  137. equal( $( this["id"] ).offset().top, this["top"] + 2, "Setting one property at a time." );
  138. equal( $( this["id"] ).offset().left, this["left"] + 2, "Setting one property at a time." );
  139. $( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
  140. $( this ).css({
  141. "top": props.top + 1,
  142. "left": props.left + 1
  143. });
  144. }});
  145. equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
  146. equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
  147. });
  148. });
  149. testIframe("offset/relative", "relative", function( $ ) {
  150. expect(60);
  151. // IE is collapsing the top margin of 1px; detect and adjust accordingly
  152. var ie = $("#relative-1").offset().top === 6;
  153. // get offset
  154. var tests = [
  155. { "id": "#relative-1", "top": ie ? 6 : 7, "left": 7 },
  156. { "id": "#relative-1-1", "top": ie ? 13 : 15, "left": 15 },
  157. { "id": "#relative-2", "top": ie ? 141 : 142, "left": 27 }
  158. ];
  159. jQuery.each( tests, function() {
  160. equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
  161. equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
  162. });
  163. // get position
  164. tests = [
  165. { "id": "#relative-1", "top": ie ? 5 : 6, "left": 6 },
  166. { "id": "#relative-1-1", "top": ie ? 4 : 5, "left": 5 },
  167. { "id": "#relative-2", "top": ie ? 140 : 141, "left": 26 }
  168. ];
  169. jQuery.each( tests, function() {
  170. equal( $( this["id"] ).position().top, this["top"], "jQuery('" + this["id"] + "').position().top" );
  171. equal( $( this["id"] ).position().left, this["left"], "jQuery('" + this["id"] + "').position().left" );
  172. });
  173. // set offset
  174. tests = [
  175. { "id": "#relative-2", "top": 200, "left": 50 },
  176. { "id": "#relative-2", "top": 100, "left": 10 },
  177. { "id": "#relative-2", "top": -5, "left": -5 },
  178. { "id": "#relative-2", "top": 142, "left": 27 },
  179. { "id": "#relative-1-1", "top": 100, "left": 100 },
  180. { "id": "#relative-1-1", "top": 5, "left": 5 },
  181. { "id": "#relative-1-1", "top": -1, "left": -1 },
  182. { "id": "#relative-1-1", "top": 15, "left": 15 },
  183. { "id": "#relative-1", "top": 100, "left": 100 },
  184. { "id": "#relative-1", "top": 0, "left": 0 },
  185. { "id": "#relative-1", "top": -1, "left": -1 },
  186. { "id": "#relative-1", "top": 7, "left": 7 }
  187. ];
  188. jQuery.each( tests, function() {
  189. $( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
  190. equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
  191. equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
  192. $( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
  193. $( this ).css({
  194. "top": props.top + 1,
  195. "left": props.left + 1
  196. });
  197. }});
  198. equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
  199. equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
  200. });
  201. });
  202. testIframe("offset/static", "static", function( $ ) {
  203. // IE is collapsing the top margin of 1px; detect and adjust accordingly
  204. var ie = $("#static-1").offset().top === 6;
  205. expect( 80 );
  206. // get offset
  207. var tests = [
  208. { "id": "#static-1", "top": ie ? 6 : 7, "left": 7 },
  209. { "id": "#static-1-1", "top": ie ? 13 : 15, "left": 15 },
  210. { "id": "#static-1-1-1", "top": ie ? 20 : 23, "left": 23 },
  211. { "id": "#static-2", "top": ie ? 121 : 122, left: 7 }
  212. ];
  213. jQuery.each( tests, function() {
  214. equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
  215. equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
  216. });
  217. // get position
  218. tests = [
  219. { "id": "#static-1", "top": ie ? 5 : 6, "left": 6 },
  220. { "id": "#static-1-1", "top": ie ? 12 : 14, "left": 14 },
  221. { "id": "#static-1-1-1", "top": ie ? 19 : 22, "left": 22 },
  222. { "id": "#static-2", "top": ie ? 120 : 121, "left": 6 }
  223. ];
  224. jQuery.each( tests, function() {
  225. equal( $( this["id"] ).position().top, this["top"], "jQuery('" + this["top"] + "').position().top" );
  226. equal( $( this["id"] ).position().left, this["left"], "jQuery('" + this["left"] +"').position().left" );
  227. });
  228. // set offset
  229. tests = [
  230. { "id": "#static-2", "top": 200, "left": 200 },
  231. { "id": "#static-2", "top": 100, "left": 100 },
  232. { "id": "#static-2", "top": -2, "left": -2 },
  233. { "id": "#static-2", "top": 121, "left": 6 },
  234. { "id": "#static-1-1-1", "top": 50, "left": 50 },
  235. { "id": "#static-1-1-1", "top": 10, "left": 10 },
  236. { "id": "#static-1-1-1", "top": -1, "left": -1 },
  237. { "id": "#static-1-1-1", "top": 22, "left": 22 },
  238. { "id": "#static-1-1", "top": 25, "left": 25 },
  239. { "id": "#static-1-1", "top": 10, "left": 10 },
  240. { "id": "#static-1-1", "top": -3, "left": -3 },
  241. { "id": "#static-1-1", "top": 14, "left": 14 },
  242. { "id": "#static-1", "top": 30, "left": 30 },
  243. { "id": "#static-1", "top": 2, "left": 2 },
  244. { "id": "#static-1", "top": -2, "left": -2 },
  245. { "id": "#static-1", "top": 7, "left": 7 }
  246. ];
  247. jQuery.each( tests, function() {
  248. $( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
  249. equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
  250. equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
  251. $( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
  252. $( this ).css({
  253. "top": props.top + 1,
  254. "left": props.left + 1
  255. });
  256. }});
  257. equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
  258. equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
  259. });
  260. });
  261. testIframe("offset/fixed", "fixed", function( $ ) {
  262. // IE is collapsing the top margin of 1px; detect and adjust accordingly
  263. var ie = $("#fixed-1").position().top === 2;
  264. expect(34);
  265. var tests = [
  266. {
  267. "id": "#fixed-1",
  268. "offsetTop": 1001,
  269. "offsetLeft": 1001,
  270. "positionTop": ie ? 2 : 0,
  271. "positionLeft": ie ? 2 : 0
  272. },
  273. {
  274. "id": "#fixed-2",
  275. "offsetTop": 1021,
  276. "offsetLeft": 1021,
  277. "positionTop": ie ? 22 : 20,
  278. "positionLeft": ie ? 22 : 20
  279. }
  280. ];
  281. jQuery.each( tests, function() {
  282. if ( !window.supportsScroll ) {
  283. ok( true, "Browser doesn't support scroll position." );
  284. ok( true, "Browser doesn't support scroll position." );
  285. ok( true, "Browser doesn't support scroll position." );
  286. ok( true, "Browser doesn't support scroll position." );
  287. } else if ( window.supportsFixedPosition ) {
  288. equal( $( this["id"] ).offset().top, this["offsetTop"], "jQuery('" + this["id"] + "').offset().top" );
  289. equal( $( this["id"] ).position().top, this["positionTop"], "jQuery('" + this["id"] + "').position().top" );
  290. equal( $( this["id"] ).offset().left, this["offsetLeft"], "jQuery('" + this["id"] + "').offset().left" );
  291. equal( $( this["id"] ).position().left, this["positionLeft"], "jQuery('" + this["id"] + "').position().left" );
  292. } else {
  293. // need to have same number of assertions
  294. ok( true, "Fixed position is not supported" );
  295. ok( true, "Fixed position is not supported" );
  296. ok( true, "Fixed position is not supported" );
  297. ok( true, "Fixed position is not supported" );
  298. }
  299. });
  300. tests = [
  301. { "id": "#fixed-1", "top": 100, "left": 100 },
  302. { "id": "#fixed-1", "top": 0, "left": 0 },
  303. { "id": "#fixed-1", "top": -4, "left": -4 },
  304. { "id": "#fixed-2", "top": 200, "left": 200 },
  305. { "id": "#fixed-2", "top": 0, "left": 0 },
  306. { "id": "#fixed-2", "top": -5, "left": -5 }
  307. ];
  308. jQuery.each( tests, function() {
  309. if ( window.supportsFixedPosition ) {
  310. $( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
  311. equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
  312. equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
  313. $( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
  314. $( this ).css({
  315. "top": props.top + 1,
  316. "left": props.left + 1
  317. });
  318. }});
  319. equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
  320. equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
  321. } else {
  322. // need to have same number of assertions
  323. ok( true, "Fixed position is not supported" );
  324. ok( true, "Fixed position is not supported" );
  325. ok( true, "Fixed position is not supported" );
  326. ok( true, "Fixed position is not supported" );
  327. }
  328. });
  329. // Bug 8316
  330. var $noTopLeft = $("#fixed-no-top-left");
  331. if ( window.supportsFixedPosition ) {
  332. equal( $noTopLeft.offset().top, 1007, "Check offset top for fixed element with no top set" );
  333. equal( $noTopLeft.offset().left, 1007, "Check offset left for fixed element with no left set" );
  334. } else {
  335. // need to have same number of assertions
  336. ok( true, "Fixed position is not supported" );
  337. ok( true, "Fixed position is not supported" );
  338. }
  339. });
  340. testIframe("offset/table", "table", function( $ ) {
  341. expect(4);
  342. equal( $("#table-1").offset().top, 6, "jQuery('#table-1').offset().top" );
  343. equal( $("#table-1").offset().left, 6, "jQuery('#table-1').offset().left" );
  344. equal( $("#th-1").offset().top, 10, "jQuery('#th-1').offset().top" );
  345. equal( $("#th-1").offset().left, 10, "jQuery('#th-1').offset().left" );
  346. });
  347. testIframe("offset/scroll", "scroll", function( $, win ) {
  348. expect(24);
  349. // If we're going to bastardize the tests, let's just DO it
  350. var ie = /msie [678]/i.test( navigator.userAgent );
  351. if ( ie ) {
  352. ok( true, "TestSwarm's iframe has hosed this test in oldIE, we surrender" );
  353. } else {
  354. equal( $("#scroll-1").offset().top, 7, "jQuery('#scroll-1').offset().top" );
  355. }
  356. equal( $("#scroll-1").offset().left, 7, "jQuery('#scroll-1').offset().left" );
  357. if ( ie ) {
  358. ok( true, "TestSwarm's iframe has hosed this test in oldIE, we surrender" );
  359. } else {
  360. equal( $("#scroll-1-1").offset().top, 11, "jQuery('#scroll-1-1').offset().top" );
  361. }
  362. equal( $("#scroll-1-1").offset().left, 11, "jQuery('#scroll-1-1').offset().left" );
  363. // scroll offset tests .scrollTop/Left
  364. equal( $("#scroll-1").scrollTop(), 5, "jQuery('#scroll-1').scrollTop()" );
  365. equal( $("#scroll-1").scrollLeft(), 5, "jQuery('#scroll-1').scrollLeft()" );
  366. equal( $("#scroll-1-1").scrollTop(), 0, "jQuery('#scroll-1-1').scrollTop()" );
  367. equal( $("#scroll-1-1").scrollLeft(), 0, "jQuery('#scroll-1-1').scrollLeft()" );
  368. // scroll method chaining
  369. equal( $("#scroll-1").scrollTop(undefined).scrollTop(), 5, ".scrollTop(undefined) is chainable (#5571)" );
  370. equal( $("#scroll-1").scrollLeft(undefined).scrollLeft(), 5, ".scrollLeft(undefined) is chainable (#5571)" );
  371. win.name = "test";
  372. if ( !window.supportsScroll ) {
  373. ok( true, "Browser doesn't support scroll position." );
  374. ok( true, "Browser doesn't support scroll position." );
  375. ok( true, "Browser doesn't support scroll position." );
  376. ok( true, "Browser doesn't support scroll position." );
  377. } else {
  378. equal( $(win).scrollTop(), 1000, "jQuery(window).scrollTop()" );
  379. equal( $(win).scrollLeft(), 1000, "jQuery(window).scrollLeft()" );
  380. equal( $(win.document).scrollTop(), 1000, "jQuery(document).scrollTop()" );
  381. equal( $(win.document).scrollLeft(), 1000, "jQuery(document).scrollLeft()" );
  382. }
  383. // test jQuery using parent window/document
  384. // jQuery reference here is in the iframe
  385. window.scrollTo(0,0);
  386. equal( $(window).scrollTop(), 0, "jQuery(window).scrollTop() other window" );
  387. equal( $(window).scrollLeft(), 0, "jQuery(window).scrollLeft() other window" );
  388. equal( $(document).scrollTop(), 0, "jQuery(window).scrollTop() other document" );
  389. equal( $(document).scrollLeft(), 0, "jQuery(window).scrollLeft() other document" );
  390. // Tests scrollTop/Left with empty jquery objects
  391. notEqual( $().scrollTop(100), null, "jQuery().scrollTop(100) testing setter on empty jquery object" );
  392. notEqual( $().scrollLeft(100), null, "jQuery().scrollLeft(100) testing setter on empty jquery object" );
  393. notEqual( $().scrollTop(null), null, "jQuery().scrollTop(null) testing setter on empty jquery object" );
  394. notEqual( $().scrollLeft(null), null, "jQuery().scrollLeft(null) testing setter on empty jquery object" );
  395. strictEqual( $().scrollTop(), null, "jQuery().scrollTop(100) testing setter on empty jquery object" );
  396. strictEqual( $().scrollLeft(), null, "jQuery().scrollLeft(100) testing setter on empty jquery object" );
  397. });
  398. testIframe("offset/body", "body", function( $ ) {
  399. expect(4);
  400. equal( $("body").offset().top, 1, "jQuery('#body').offset().top" );
  401. equal( $("body").offset().left, 1, "jQuery('#body').offset().left" );
  402. equal( $("#firstElement").position().left, 5, "$('#firstElement').position().left" );
  403. equal( $("#firstElement").position().top, 5, "$('#firstElement').position().top" );
  404. });
  405. test("chaining", function() {
  406. expect(3);
  407. var coords = { "top": 1, "left": 1 };
  408. equal( jQuery("#absolute-1").offset(coords).selector, "#absolute-1", "offset(coords) returns jQuery object" );
  409. equal( jQuery("#non-existent").offset(coords).selector, "#non-existent", "offset(coords) with empty jQuery set returns jQuery object" );
  410. equal( jQuery("#absolute-1").offset(undefined).selector, "#absolute-1", "offset(undefined) returns jQuery object (#5571)" );
  411. });
  412. test("offsetParent", function(){
  413. expect(13);
  414. var body = jQuery("body").offsetParent();
  415. equal( body.length, 1, "Only one offsetParent found." );
  416. equal( body[0], document.documentElement, "The html element is the offsetParent of the body." );
  417. var header = jQuery("#qunit").offsetParent();
  418. equal( header.length, 1, "Only one offsetParent found." );
  419. equal( header[0], document.documentElement, "The html element is the offsetParent of #qunit." );
  420. var div = jQuery("#nothiddendivchild").offsetParent();
  421. equal( div.length, 1, "Only one offsetParent found." );
  422. equal( div[0], document.getElementById("qunit-fixture"), "The #qunit-fixture is the offsetParent of #nothiddendivchild." );
  423. jQuery("#nothiddendiv").css("position", "relative");
  424. div = jQuery("#nothiddendivchild").offsetParent();
  425. equal( div.length, 1, "Only one offsetParent found." );
  426. equal( div[0], jQuery("#nothiddendiv")[0], "The div is the offsetParent." );
  427. div = jQuery("body, #nothiddendivchild").offsetParent();
  428. equal( div.length, 2, "Two offsetParent found." );
  429. equal( div[0], document.documentElement, "The html element is the offsetParent of the body." );
  430. equal( div[1], jQuery("#nothiddendiv")[0], "The div is the offsetParent." );
  431. var area = jQuery("#imgmap area").offsetParent();
  432. equal( area[0], document.documentElement, "The html element is the offsetParent of the body." );
  433. div = jQuery("<div>").css({ "position": "absolute" }).appendTo("body");
  434. equal( div.offsetParent()[0], document.documentElement, "Absolutely positioned div returns html as offset parent, see #12139" );
  435. div.remove();
  436. });
  437. test("fractions (see #7730 and #7885)", function() {
  438. expect(2);
  439. jQuery("body").append("<div id='fractions'/>");
  440. var expected = { "top": 1000, "left": 1000 };
  441. var div = jQuery("#fractions");
  442. div.css({
  443. "position": "absolute",
  444. "left": "1000.7432222px",
  445. "top": "1000.532325px",
  446. "width": 100,
  447. "height": 100
  448. });
  449. div.offset(expected);
  450. var result = div.offset();
  451. equal( result.top, expected.top, "Check top" );
  452. equal( result.left, expected.left, "Check left" );
  453. div.remove();
  454. });
  455. })();