2012-11-03 04:06:50 +00:00
|
|
|
(function() {
|
|
|
|
|
|
|
|
if ( !jQuery.fn.offset ) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
var supportsScroll, supportsFixedPosition,
|
|
|
|
forceScroll = jQuery("<div/>").css({ width: 2000, height: 2000 }),
|
|
|
|
checkSupport = function() {
|
|
|
|
// Only run once
|
|
|
|
checkSupport = false;
|
|
|
|
|
|
|
|
var checkFixed = jQuery("<div/>").css({ position: "fixed", top: "20px" }).appendTo("#qunit-fixture");
|
|
|
|
|
|
|
|
// Must append to body because #qunit-fixture is hidden and elements inside it don't have a scrollTop
|
|
|
|
forceScroll.appendTo("body");
|
|
|
|
window.scrollTo( 200, 200 );
|
|
|
|
supportsScroll = document.documentElement.scrollTop || document.body.scrollTop;
|
|
|
|
forceScroll.detach();
|
|
|
|
|
2013-04-04 20:04:39 +00:00
|
|
|
supportsFixedPosition = checkFixed[0].offsetTop === 20;
|
2012-11-03 04:06:50 +00:00
|
|
|
checkFixed.remove();
|
|
|
|
};
|
2012-06-07 15:24:35 +00:00
|
|
|
|
2012-10-17 17:40:52 +00:00
|
|
|
module("offset", { setup: function(){
|
2012-11-03 04:06:50 +00:00
|
|
|
if ( typeof checkSupport === "function" ) {
|
|
|
|
checkSupport();
|
|
|
|
}
|
2012-10-17 17:40:52 +00:00
|
|
|
|
2012-11-03 04:06:50 +00:00
|
|
|
// Force a scroll value on the main window to ensure incorrect results
|
|
|
|
// if offset is using the scroll offset of the parent window
|
|
|
|
forceScroll.appendTo("body");
|
2012-10-17 17:40:52 +00:00
|
|
|
window.scrollTo( 1, 1 );
|
2012-11-03 04:06:50 +00:00
|
|
|
forceScroll.detach();
|
2012-10-17 17:40:52 +00:00
|
|
|
}, teardown: moduleTeardown });
|
2007-12-04 20:51:16 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
/*
|
|
|
|
Closure-compiler will roll static methods off of the jQuery object and so they will
|
|
|
|
not be passed with the jQuery object across the windows. To differentiate this, the
|
|
|
|
testIframe callbacks use the "$" symbol to refer to the jQuery object passed from
|
|
|
|
the iframe window and the "jQuery" symbol is used to access any static methods.
|
|
|
|
*/
|
|
|
|
|
2012-07-10 03:06:51 +00:00
|
|
|
test("empty set", function() {
|
|
|
|
expect(2);
|
2012-07-11 01:44:03 +00:00
|
|
|
strictEqual( jQuery().offset(), undefined, "offset() returns undefined for empty set (#11962)" );
|
|
|
|
strictEqual( jQuery().position(), undefined, "position() returns undefined for empty set (#11962)" );
|
2012-07-10 03:06:51 +00:00
|
|
|
});
|
|
|
|
|
2012-09-13 22:47:07 +00:00
|
|
|
test("object without getBoundingClientRect", function() {
|
|
|
|
expect(2);
|
|
|
|
|
|
|
|
// Simulates a browser without gBCR on elements, we just want to return 0,0
|
|
|
|
var result = jQuery({ ownerDocument: document }).offset();
|
|
|
|
equal( result.top, 0, "Check top" );
|
|
|
|
equal( result.left, 0, "Check left" );
|
|
|
|
});
|
|
|
|
|
2010-09-28 14:55:48 +00:00
|
|
|
test("disconnected node", function() {
|
|
|
|
expect(2);
|
|
|
|
|
|
|
|
var result = jQuery( document.createElement("div") ).offset();
|
|
|
|
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( result.top, 0, "Check top" );
|
|
|
|
equal( result.left, 0, "Check left" );
|
2010-09-28 14:55:48 +00:00
|
|
|
});
|
|
|
|
|
2012-02-23 20:48:12 +00:00
|
|
|
testIframe("offset/absolute", "absolute", function($, iframe) {
|
2010-02-28 01:43:23 +00:00
|
|
|
expect(4);
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-06-05 20:38:18 +00:00
|
|
|
var doc = iframe.document,
|
2012-10-17 17:40:52 +00:00
|
|
|
tests;
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2010-02-28 01:43:23 +00:00
|
|
|
// get offset
|
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#absolute-1", "top": 1, "left": 1 }
|
2010-02-28 01:43:23 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( jQuery( this["id"], doc ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
|
|
|
|
equal( jQuery( this["id"], doc ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
|
2010-02-28 01:43:23 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// get position
|
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#absolute-1", "top": 0, "left": 0 }
|
2010-02-28 01:43:23 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( jQuery( this["id"], doc ).position().top, this["top"], "jQuery('" + this["id"] + "').position().top" );
|
|
|
|
equal( jQuery( this["id"], doc ).position().left, this["left"], "jQuery('" + this["id"] + "').position().left" );
|
2010-02-28 01:43:23 +00:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
testIframe("offset/absolute", "absolute", function( $ ) {
|
2010-03-23 00:11:37 +00:00
|
|
|
expect(178);
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2013-04-09 15:45:09 +00:00
|
|
|
var tests, offset;
|
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// get offset tests
|
2013-04-09 15:45:09 +00:00
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#absolute-1", "top": 1, "left": 1 },
|
|
|
|
{ "id": "#absolute-1-1", "top": 5, "left": 5 },
|
|
|
|
{ "id": "#absolute-1-1-1", "top": 9, "left": 9 },
|
|
|
|
{ "id": "#absolute-2", "top": 20, "left": 20 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2010-12-30 06:34:48 +00:00
|
|
|
|
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// get position
|
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#absolute-1", "top": 0, "left": 0 },
|
|
|
|
{ "id": "#absolute-1-1", "top": 1, "left": 1 },
|
|
|
|
{ "id": "#absolute-1-1-1", "top": 1, "left": 1 },
|
|
|
|
{ "id": "#absolute-2", "top": 19, "left": 19 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).position().top, this["top"], "jQuery('" + this["id"] + "').position().top" );
|
|
|
|
equal( $( this["id"] ).position().left, this["left"], "jQuery('" + this["id"] + "').position().left" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2010-03-23 00:11:37 +00:00
|
|
|
// test #5781
|
2013-04-09 15:45:09 +00:00
|
|
|
offset = $( "#positionTest" ).offset({ "top": 10, "left": 10 }).offset();
|
2012-06-21 19:30:24 +00:00
|
|
|
equal( offset.top, 10, "Setting offset on element with position absolute but 'auto' values." );
|
|
|
|
equal( offset.left, 10, "Setting offset on element with position absolute but 'auto' values." );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// set offset
|
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#absolute-2", "top": 30, "left": 30 },
|
|
|
|
{ "id": "#absolute-2", "top": 10, "left": 10 },
|
|
|
|
{ "id": "#absolute-2", "top": -1, "left": -1 },
|
|
|
|
{ "id": "#absolute-2", "top": 19, "left": 19 },
|
|
|
|
{ "id": "#absolute-1-1-1", "top": 15, "left": 15 },
|
|
|
|
{ "id": "#absolute-1-1-1", "top": 5, "left": 5 },
|
|
|
|
{ "id": "#absolute-1-1-1", "top": -1, "left": -1 },
|
|
|
|
{ "id": "#absolute-1-1-1", "top": 9, "left": 9 },
|
|
|
|
{ "id": "#absolute-1-1", "top": 10, "left": 10 },
|
|
|
|
{ "id": "#absolute-1-1", "top": 0, "left": 0 },
|
|
|
|
{ "id": "#absolute-1-1", "top": -1, "left": -1 },
|
|
|
|
{ "id": "#absolute-1-1", "top": 5, "left": 5 },
|
|
|
|
{ "id": "#absolute-1", "top": 2, "left": 2 },
|
|
|
|
{ "id": "#absolute-1", "top": 0, "left": 0 },
|
|
|
|
{ "id": "#absolute-1", "top": -1, "left": -1 },
|
|
|
|
{ "id": "#absolute-1", "top": 1, "left": 1 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
|
|
|
|
equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
var top = this["top"], left = this["left"];
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
$( this["id"] ).offset(function(i, val){
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( val.top, top, "Verify incoming top position." );
|
|
|
|
equal( val.left, left, "Verify incoming top position." );
|
2012-07-05 19:52:13 +00:00
|
|
|
return { "top": top + 1, "left": left + 1 };
|
2010-01-07 19:07:21 +00:00
|
|
|
});
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + " })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + " })" );
|
|
|
|
|
|
|
|
$( this["id"] )
|
|
|
|
.offset({ "left": this["left"] + 2 })
|
|
|
|
.offset({ "top": this["top"] + 2 });
|
|
|
|
equal( $( this["id"] ).offset().top, this["top"] + 2, "Setting one property at a time." );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"] + 2, "Setting one property at a time." );
|
|
|
|
|
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
|
|
|
|
$( this ).css({
|
|
|
|
"top": props.top + 1,
|
|
|
|
"left": props.left + 1
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
|
|
|
}});
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2007-12-04 20:51:16 +00:00
|
|
|
});
|
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
testIframe("offset/relative", "relative", function( $ ) {
|
2010-01-07 19:07:21 +00:00
|
|
|
expect(60);
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// get offset
|
2013-09-07 00:46:55 +00:00
|
|
|
var tests = [
|
|
|
|
{ "id": "#relative-1", "top": 7, "left": 7 },
|
|
|
|
{ "id": "#relative-1-1", "top": 15, "left": 15 },
|
|
|
|
{ "id": "#relative-2", "top": 142, "left": 27 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2010-12-30 06:34:48 +00:00
|
|
|
|
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// get position
|
|
|
|
tests = [
|
2013-09-07 00:46:55 +00:00
|
|
|
{ "id": "#relative-1", "top": 6, "left": 6 },
|
|
|
|
{ "id": "#relative-1-1", "top": 5, "left": 5 },
|
|
|
|
{ "id": "#relative-2", "top": 141, "left": 26 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).position().top, this["top"], "jQuery('" + this["id"] + "').position().top" );
|
|
|
|
equal( $( this["id"] ).position().left, this["left"], "jQuery('" + this["id"] + "').position().left" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2010-12-30 06:34:48 +00:00
|
|
|
|
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// set offset
|
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#relative-2", "top": 200, "left": 50 },
|
|
|
|
{ "id": "#relative-2", "top": 100, "left": 10 },
|
|
|
|
{ "id": "#relative-2", "top": -5, "left": -5 },
|
|
|
|
{ "id": "#relative-2", "top": 142, "left": 27 },
|
|
|
|
{ "id": "#relative-1-1", "top": 100, "left": 100 },
|
|
|
|
{ "id": "#relative-1-1", "top": 5, "left": 5 },
|
|
|
|
{ "id": "#relative-1-1", "top": -1, "left": -1 },
|
|
|
|
{ "id": "#relative-1-1", "top": 15, "left": 15 },
|
|
|
|
{ "id": "#relative-1", "top": 100, "left": 100 },
|
|
|
|
{ "id": "#relative-1", "top": 0, "left": 0 },
|
|
|
|
{ "id": "#relative-1", "top": -1, "left": -1 },
|
|
|
|
{ "id": "#relative-1", "top": 7, "left": 7 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
|
|
|
|
equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
|
|
|
|
|
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
|
|
|
|
$( this ).css({
|
|
|
|
"top": props.top + 1,
|
|
|
|
"left": props.left + 1
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
|
|
|
}});
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2007-12-12 16:55:55 +00:00
|
|
|
});
|
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
testIframe("offset/static", "static", function( $ ) {
|
2013-04-09 15:45:09 +00:00
|
|
|
expect( 80 );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// get offset
|
2013-09-07 00:46:55 +00:00
|
|
|
var tests = [
|
|
|
|
{ "id": "#static-1", "top": 7, "left": 7 },
|
|
|
|
{ "id": "#static-1-1", "top": 15, "left": 15 },
|
|
|
|
{ "id": "#static-1-1-1", "top": 23, "left": 23 },
|
|
|
|
{ "id": "#static-2", "top": 122, left: 7 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset().top" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset().left" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2010-12-30 06:34:48 +00:00
|
|
|
|
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// get position
|
|
|
|
tests = [
|
2013-09-07 00:46:55 +00:00
|
|
|
{ "id": "#static-1", "top": 6, "left": 6 },
|
|
|
|
{ "id": "#static-1-1", "top": 14, "left": 14 },
|
|
|
|
{ "id": "#static-1-1-1", "top": 22, "left": 22 },
|
|
|
|
{ "id": "#static-2", "top": 121, "left": 6 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).position().top, this["top"], "jQuery('" + this["top"] + "').position().top" );
|
|
|
|
equal( $( this["id"] ).position().left, this["left"], "jQuery('" + this["left"] +"').position().left" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2010-12-30 06:34:48 +00:00
|
|
|
|
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
// set offset
|
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#static-2", "top": 200, "left": 200 },
|
|
|
|
{ "id": "#static-2", "top": 100, "left": 100 },
|
|
|
|
{ "id": "#static-2", "top": -2, "left": -2 },
|
|
|
|
{ "id": "#static-2", "top": 121, "left": 6 },
|
|
|
|
{ "id": "#static-1-1-1", "top": 50, "left": 50 },
|
|
|
|
{ "id": "#static-1-1-1", "top": 10, "left": 10 },
|
|
|
|
{ "id": "#static-1-1-1", "top": -1, "left": -1 },
|
|
|
|
{ "id": "#static-1-1-1", "top": 22, "left": 22 },
|
|
|
|
{ "id": "#static-1-1", "top": 25, "left": 25 },
|
|
|
|
{ "id": "#static-1-1", "top": 10, "left": 10 },
|
|
|
|
{ "id": "#static-1-1", "top": -3, "left": -3 },
|
|
|
|
{ "id": "#static-1-1", "top": 14, "left": 14 },
|
|
|
|
{ "id": "#static-1", "top": 30, "left": 30 },
|
2012-07-25 19:42:06 +00:00
|
|
|
{ "id": "#static-1", "top": 2, "left": 2 },
|
|
|
|
{ "id": "#static-1", "top": -2, "left": -2 },
|
|
|
|
{ "id": "#static-1", "top": 7, "left": 7 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
|
|
|
jQuery.each( tests, function() {
|
2012-07-05 19:52:13 +00:00
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
|
|
|
|
equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
|
|
|
|
|
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
|
|
|
|
$( this ).css({
|
|
|
|
"top": props.top + 1,
|
|
|
|
"left": props.left + 1
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
|
|
|
}});
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2007-12-12 16:55:55 +00:00
|
|
|
});
|
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
testIframe("offset/fixed", "fixed", function( $ ) {
|
2012-10-17 17:40:52 +00:00
|
|
|
expect(34);
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2013-09-07 00:46:55 +00:00
|
|
|
var tests, $noTopLeft;
|
2013-04-09 15:45:09 +00:00
|
|
|
|
|
|
|
tests = [
|
2012-10-17 18:51:58 +00:00
|
|
|
{
|
|
|
|
"id": "#fixed-1",
|
|
|
|
"offsetTop": 1001,
|
|
|
|
"offsetLeft": 1001,
|
2013-09-07 00:46:55 +00:00
|
|
|
"positionTop": 0,
|
|
|
|
"positionLeft": 0
|
2012-10-17 18:51:58 +00:00
|
|
|
},
|
|
|
|
{
|
|
|
|
"id": "#fixed-2",
|
|
|
|
"offsetTop": 1021,
|
|
|
|
"offsetLeft": 1021,
|
2013-09-07 00:46:55 +00:00
|
|
|
"positionTop": 20,
|
|
|
|
"positionLeft": 20
|
2012-10-17 18:51:58 +00:00
|
|
|
}
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
2010-03-25 21:30:13 +00:00
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
jQuery.each( tests, function() {
|
2012-10-17 17:40:52 +00:00
|
|
|
if ( !window.supportsScroll ) {
|
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
2010-03-25 21:30:13 +00:00
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
|
|
|
|
2012-10-17 17:40:52 +00:00
|
|
|
} else if ( window.supportsFixedPosition ) {
|
|
|
|
equal( $( this["id"] ).offset().top, this["offsetTop"], "jQuery('" + this["id"] + "').offset().top" );
|
|
|
|
equal( $( this["id"] ).position().top, this["positionTop"], "jQuery('" + this["id"] + "').position().top" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["offsetLeft"], "jQuery('" + this["id"] + "').offset().left" );
|
|
|
|
equal( $( this["id"] ).position().left, this["positionLeft"], "jQuery('" + this["id"] + "').position().left" );
|
2009-09-15 19:15:04 +00:00
|
|
|
} else {
|
|
|
|
// need to have same number of assertions
|
2011-04-12 08:47:46 +00:00
|
|
|
ok( true, "Fixed position is not supported" );
|
|
|
|
ok( true, "Fixed position is not supported" );
|
2012-10-17 18:51:58 +00:00
|
|
|
ok( true, "Fixed position is not supported" );
|
|
|
|
ok( true, "Fixed position is not supported" );
|
2009-09-15 19:15:04 +00:00
|
|
|
}
|
|
|
|
});
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
tests = [
|
2012-07-05 19:52:13 +00:00
|
|
|
{ "id": "#fixed-1", "top": 100, "left": 100 },
|
|
|
|
{ "id": "#fixed-1", "top": 0, "left": 0 },
|
|
|
|
{ "id": "#fixed-1", "top": -4, "left": -4 },
|
|
|
|
{ "id": "#fixed-2", "top": 200, "left": 200 },
|
|
|
|
{ "id": "#fixed-2", "top": 0, "left": 0 },
|
|
|
|
{ "id": "#fixed-2", "top": -5, "left": -5 }
|
2009-09-15 19:15:04 +00:00
|
|
|
];
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2009-09-15 19:15:04 +00:00
|
|
|
jQuery.each( tests, function() {
|
2012-10-17 17:40:52 +00:00
|
|
|
if ( window.supportsFixedPosition ) {
|
2012-07-05 19:52:13 +00:00
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"] });
|
|
|
|
equal( $( this["id"] ).offset().top, this["top"], "jQuery('" + this["id"] + "').offset({ top: " + this["top"] + " })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"], "jQuery('" + this["id"] + "').offset({ left: " + this["left"] + " })" );
|
|
|
|
|
|
|
|
$( this["id"] ).offset({ "top": this["top"], "left": this["left"], "using": function( props ) {
|
|
|
|
$( this ).css({
|
|
|
|
"top": props.top + 1,
|
|
|
|
"left": props.left + 1
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
|
|
|
}});
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $( this["id"] ).offset().top, this["top"] + 1, "jQuery('" + this["id"] + "').offset({ top: " + (this["top"] + 1) + ", using: fn })" );
|
|
|
|
equal( $( this["id"] ).offset().left, this["left"] + 1, "jQuery('" + this["id"] + "').offset({ left: " + (this["left"] + 1) + ", using: fn })" );
|
2009-09-15 19:15:04 +00:00
|
|
|
} else {
|
|
|
|
// need to have same number of assertions
|
2011-04-12 08:47:46 +00:00
|
|
|
ok( true, "Fixed position is not supported" );
|
|
|
|
ok( true, "Fixed position is not supported" );
|
|
|
|
ok( true, "Fixed position is not supported" );
|
|
|
|
ok( true, "Fixed position is not supported" );
|
2009-09-15 19:15:04 +00:00
|
|
|
}
|
2007-12-12 16:55:55 +00:00
|
|
|
});
|
2011-03-31 06:55:16 +00:00
|
|
|
|
|
|
|
// Bug 8316
|
2013-04-09 15:45:09 +00:00
|
|
|
$noTopLeft = $("#fixed-no-top-left");
|
2012-10-17 17:40:52 +00:00
|
|
|
if ( window.supportsFixedPosition ) {
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( $noTopLeft.offset().top, 1007, "Check offset top for fixed element with no top set" );
|
|
|
|
equal( $noTopLeft.offset().left, 1007, "Check offset left for fixed element with no left set" );
|
2011-03-31 06:55:16 +00:00
|
|
|
} else {
|
|
|
|
// need to have same number of assertions
|
2011-04-12 08:47:46 +00:00
|
|
|
ok( true, "Fixed position is not supported" );
|
|
|
|
ok( true, "Fixed position is not supported" );
|
2011-03-31 06:55:16 +00:00
|
|
|
}
|
2009-09-15 19:15:04 +00:00
|
|
|
});
|
2007-12-12 16:55:55 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
testIframe("offset/table", "table", function( $ ) {
|
2010-01-07 19:07:21 +00:00
|
|
|
expect(4);
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("#table-1").offset().top, 6, "jQuery('#table-1').offset().top" );
|
|
|
|
equal( $("#table-1").offset().left, 6, "jQuery('#table-1').offset().left" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("#th-1").offset().top, 10, "jQuery('#th-1').offset().top" );
|
|
|
|
equal( $("#th-1").offset().left, 10, "jQuery('#th-1').offset().left" );
|
2007-12-12 16:55:55 +00:00
|
|
|
});
|
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
testIframe("offset/scroll", "scroll", function( $, win ) {
|
|
|
|
expect(24);
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2013-09-07 00:46:55 +00:00
|
|
|
equal( $("#scroll-1").offset().top, 7, "jQuery('#scroll-1').offset().top" );
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("#scroll-1").offset().left, 7, "jQuery('#scroll-1').offset().left" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2013-09-07 00:46:55 +00:00
|
|
|
equal( $("#scroll-1-1").offset().top, 11, "jQuery('#scroll-1-1').offset().top" );
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("#scroll-1-1").offset().left, 11, "jQuery('#scroll-1-1').offset().left" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2009-07-24 22:32:53 +00:00
|
|
|
// scroll offset tests .scrollTop/Left
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("#scroll-1").scrollTop(), 5, "jQuery('#scroll-1').scrollTop()" );
|
|
|
|
equal( $("#scroll-1").scrollLeft(), 5, "jQuery('#scroll-1').scrollLeft()" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("#scroll-1-1").scrollTop(), 0, "jQuery('#scroll-1-1').scrollTop()" );
|
|
|
|
equal( $("#scroll-1-1").scrollLeft(), 0, "jQuery('#scroll-1-1').scrollLeft()" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2011-12-06 20:25:38 +00:00
|
|
|
// scroll method chaining
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("#scroll-1").scrollTop(undefined).scrollTop(), 5, ".scrollTop(undefined) is chainable (#5571)" );
|
|
|
|
equal( $("#scroll-1").scrollLeft(undefined).scrollLeft(), 5, ".scrollLeft(undefined) is chainable (#5571)" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2009-07-24 22:32:53 +00:00
|
|
|
win.name = "test";
|
2010-03-25 21:30:13 +00:00
|
|
|
|
2012-10-17 17:40:52 +00:00
|
|
|
if ( !window.supportsScroll ) {
|
2010-03-25 21:30:13 +00:00
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
|
|
|
|
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
|
|
|
ok( true, "Browser doesn't support scroll position." );
|
|
|
|
} else {
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $(win).scrollTop(), 1000, "jQuery(window).scrollTop()" );
|
|
|
|
equal( $(win).scrollLeft(), 1000, "jQuery(window).scrollLeft()" );
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $(win.document).scrollTop(), 1000, "jQuery(document).scrollTop()" );
|
|
|
|
equal( $(win.document).scrollLeft(), 1000, "jQuery(document).scrollLeft()" );
|
2010-03-25 21:30:13 +00:00
|
|
|
}
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2010-02-28 16:55:59 +00:00
|
|
|
// test jQuery using parent window/document
|
|
|
|
// jQuery reference here is in the iframe
|
|
|
|
window.scrollTo(0,0);
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $(window).scrollTop(), 0, "jQuery(window).scrollTop() other window" );
|
|
|
|
equal( $(window).scrollLeft(), 0, "jQuery(window).scrollLeft() other window" );
|
|
|
|
equal( $(document).scrollTop(), 0, "jQuery(window).scrollTop() other document" );
|
|
|
|
equal( $(document).scrollLeft(), 0, "jQuery(window).scrollLeft() other document" );
|
2011-07-26 15:52:01 +00:00
|
|
|
|
2011-01-10 00:11:05 +00:00
|
|
|
// Tests scrollTop/Left with empty jquery objects
|
2012-07-05 19:52:13 +00:00
|
|
|
notEqual( $().scrollTop(100), null, "jQuery().scrollTop(100) testing setter on empty jquery object" );
|
|
|
|
notEqual( $().scrollLeft(100), null, "jQuery().scrollLeft(100) testing setter on empty jquery object" );
|
|
|
|
notEqual( $().scrollTop(null), null, "jQuery().scrollTop(null) testing setter on empty jquery object" );
|
|
|
|
notEqual( $().scrollLeft(null), null, "jQuery().scrollLeft(null) testing setter on empty jquery object" );
|
|
|
|
strictEqual( $().scrollTop(), null, "jQuery().scrollTop(100) testing setter on empty jquery object" );
|
|
|
|
strictEqual( $().scrollLeft(), null, "jQuery().scrollLeft(100) testing setter on empty jquery object" );
|
2008-11-10 02:39:03 +00:00
|
|
|
});
|
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
testIframe("offset/body", "body", function( $ ) {
|
2012-08-19 19:53:09 +00:00
|
|
|
expect(4);
|
2010-12-30 06:34:48 +00:00
|
|
|
|
2012-07-05 19:52:13 +00:00
|
|
|
equal( $("body").offset().top, 1, "jQuery('#body').offset().top" );
|
|
|
|
equal( $("body").offset().left, 1, "jQuery('#body').offset().left" );
|
2012-08-19 19:53:09 +00:00
|
|
|
equal( $("#firstElement").position().left, 5, "$('#firstElement').position().left" );
|
|
|
|
equal( $("#firstElement").position().top, 5, "$('#firstElement').position().top" );
|
2009-07-17 22:15:37 +00:00
|
|
|
});
|
|
|
|
|
2011-12-06 20:25:38 +00:00
|
|
|
test("chaining", function() {
|
|
|
|
expect(3);
|
2012-07-05 19:52:13 +00:00
|
|
|
var coords = { "top": 1, "left": 1 };
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( jQuery("#absolute-1").offset(coords).selector, "#absolute-1", "offset(coords) returns jQuery object" );
|
|
|
|
equal( jQuery("#non-existent").offset(coords).selector, "#non-existent", "offset(coords) with empty jQuery set returns jQuery object" );
|
2011-12-06 20:25:38 +00:00
|
|
|
equal( jQuery("#absolute-1").offset(undefined).selector, "#absolute-1", "offset(undefined) returns jQuery object (#5571)" );
|
2010-01-21 15:18:54 +00:00
|
|
|
});
|
|
|
|
|
2009-07-19 13:04:18 +00:00
|
|
|
test("offsetParent", function(){
|
2012-10-26 16:38:05 +00:00
|
|
|
expect(13);
|
2009-07-17 22:15:37 +00:00
|
|
|
|
2013-04-09 15:45:09 +00:00
|
|
|
var body, header, div, area;
|
|
|
|
|
|
|
|
body = jQuery("body").offsetParent();
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( body.length, 1, "Only one offsetParent found." );
|
2012-08-19 19:53:09 +00:00
|
|
|
equal( body[0], document.documentElement, "The html element is the offsetParent of the body." );
|
2009-07-19 13:04:18 +00:00
|
|
|
|
2013-04-09 15:45:09 +00:00
|
|
|
header = jQuery("#qunit").offsetParent();
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( header.length, 1, "Only one offsetParent found." );
|
2012-12-11 00:07:07 +00:00
|
|
|
equal( header[0], document.documentElement, "The html element is the offsetParent of #qunit." );
|
2009-07-19 13:04:18 +00:00
|
|
|
|
2013-04-09 15:45:09 +00:00
|
|
|
div = jQuery("#nothiddendivchild").offsetParent();
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( div.length, 1, "Only one offsetParent found." );
|
2012-12-11 00:07:07 +00:00
|
|
|
equal( div[0], document.getElementById("qunit-fixture"), "The #qunit-fixture is the offsetParent of #nothiddendivchild." );
|
2009-07-19 13:04:18 +00:00
|
|
|
|
|
|
|
jQuery("#nothiddendiv").css("position", "relative");
|
|
|
|
|
|
|
|
div = jQuery("#nothiddendivchild").offsetParent();
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( div.length, 1, "Only one offsetParent found." );
|
|
|
|
equal( div[0], jQuery("#nothiddendiv")[0], "The div is the offsetParent." );
|
2009-07-19 13:04:18 +00:00
|
|
|
|
|
|
|
div = jQuery("body, #nothiddendivchild").offsetParent();
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( div.length, 2, "Two offsetParent found." );
|
2012-08-19 19:53:09 +00:00
|
|
|
equal( div[0], document.documentElement, "The html element is the offsetParent of the body." );
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( div[1], jQuery("#nothiddendiv")[0], "The div is the offsetParent." );
|
2012-07-06 13:58:34 +00:00
|
|
|
|
2013-04-09 15:45:09 +00:00
|
|
|
area = jQuery("#imgmap area").offsetParent();
|
2012-08-19 19:53:09 +00:00
|
|
|
equal( area[0], document.documentElement, "The html element is the offsetParent of the body." );
|
2012-10-26 16:38:05 +00:00
|
|
|
|
|
|
|
div = jQuery("<div>").css({ "position": "absolute" }).appendTo("body");
|
|
|
|
equal( div.offsetParent()[0], document.documentElement, "Absolutely positioned div returns html as offset parent, see #12139" );
|
|
|
|
|
|
|
|
div.remove();
|
2009-07-19 13:04:18 +00:00
|
|
|
});
|
2009-07-17 22:15:37 +00:00
|
|
|
|
2011-01-15 12:56:20 +00:00
|
|
|
test("fractions (see #7730 and #7885)", function() {
|
|
|
|
expect(2);
|
2011-07-26 15:52:01 +00:00
|
|
|
|
2012-10-16 14:17:14 +00:00
|
|
|
jQuery("body").append("<div id='fractions'/>");
|
2011-07-26 15:52:01 +00:00
|
|
|
|
2013-04-09 15:45:09 +00:00
|
|
|
var result,
|
|
|
|
expected = { "top": 1000, "left": 1000 },
|
|
|
|
div = jQuery("#fractions");
|
2011-07-26 15:52:01 +00:00
|
|
|
|
2011-01-15 12:56:20 +00:00
|
|
|
div.css({
|
2012-10-16 14:17:14 +00:00
|
|
|
"position": "absolute",
|
|
|
|
"left": "1000.7432222px",
|
|
|
|
"top": "1000.532325px",
|
2012-07-05 19:52:13 +00:00
|
|
|
"width": 100,
|
|
|
|
"height": 100
|
2011-01-15 12:56:20 +00:00
|
|
|
});
|
2011-07-26 15:52:01 +00:00
|
|
|
|
2011-01-15 12:56:20 +00:00
|
|
|
div.offset(expected);
|
2011-07-26 15:52:01 +00:00
|
|
|
|
2013-04-09 15:45:09 +00:00
|
|
|
result = div.offset();
|
2011-01-15 12:56:20 +00:00
|
|
|
|
2011-11-06 20:27:42 +00:00
|
|
|
equal( result.top, expected.top, "Check top" );
|
|
|
|
equal( result.left, expected.left, "Check left" );
|
2011-07-26 15:52:01 +00:00
|
|
|
|
2011-01-15 12:56:20 +00:00
|
|
|
div.remove();
|
|
|
|
});
|
2012-06-07 15:24:35 +00:00
|
|
|
|
2014-12-21 02:52:17 +00:00
|
|
|
test("iframe scrollTop/Left (see gh-1945)", function() {
|
|
|
|
expect( 2 );
|
|
|
|
|
|
|
|
var ifDoc = jQuery( "#iframe" )[ 0 ].contentDocument;
|
|
|
|
|
2014-12-25 01:49:56 +00:00
|
|
|
// iPhone resize the iframe by its content
|
|
|
|
// meaning it's not possible to scroll the iframe only its parent element
|
|
|
|
if ( /iphone os/i.test( navigator.userAgent ) ) {
|
|
|
|
equal( true, true, "iPhone doesn't scroll the iframes" );
|
|
|
|
equal( true, true, "iPhone doesn't scroll the iframes" );
|
2014-12-21 02:52:17 +00:00
|
|
|
|
2014-12-25 01:49:56 +00:00
|
|
|
} else {
|
|
|
|
// Tests scrollTop/Left with iframes
|
|
|
|
jQuery( "#iframe" ).css( "width", "50px" ).css( "height", "50px" );
|
|
|
|
ifDoc.write( "<div style='width: 1000px; height: 1000px;'></div>" );
|
|
|
|
|
|
|
|
jQuery( ifDoc ).scrollTop( 200 );
|
|
|
|
jQuery( ifDoc ).scrollLeft( 500 );
|
|
|
|
|
|
|
|
equal( jQuery( ifDoc ).scrollTop(), 200, "$($('#iframe')[0].contentDocument).scrollTop()" );
|
|
|
|
equal( jQuery( ifDoc ).scrollLeft(), 500, "$($('#iframe')[0].contentDocument).scrollLeft()" );
|
|
|
|
}
|
2014-12-21 02:52:17 +00:00
|
|
|
});
|
|
|
|
|
2012-11-03 04:06:50 +00:00
|
|
|
})();
|