deac/jquery
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Added more unit tests for offset. Fixed an offset issue relating to table header cells in Opera

Browse source
This commit is contained in:
Brandon Aaron 2007-12-12 16:55:55 +00:00
parent 279f77e960
commit 58c640fb1c
6 changed files with 209 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

32
test/data/offset/fixed.html Normal file
View file

@ -0,0 +1,32 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>fixed</title>
<style type="text/css" media="screen">
body { margin: 1px; padding: 5px; }
div.fixed { position: fixed; margin: 1px; border: 2px solid #000; padding: 5px; width: 100px; height: 100px; background: #fff; overflow: hidden; }
#fixed-1 { top: 0; left: 0; }
#fixed-2 { top: 20px; left: 20px; }
#forceScroll { width: 5000px; height: 5000px; }
#marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; }
</style>
<script type="text/javascript" src="../../../dist/jquery.js"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
window.scrollTo(1000,1000);
$('.fixed').click(function() {
$('#marker').css( $(this).offset() );
return false;
});
});
</script>
</head>
<body>
<div id="fixed-1" class="fixed"></div>
<div id="fixed-2" class="fixed"></div>
<div id="forceScroll"></div>
<div id="marker"></div>
</body>
</html>

38
test/data/offset/scroll.html Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>scroll</title>
<style type="text/css" media="screen">
body { margin: 1px; padding: 5px; }
div.scroll { position: relative; margin: 1px; border: 2px solid #000; padding: 5px; width: 100px; height: 100px; background: #fff; overflow: auto; }
#scroll-1 { top: 0; left: 0; }
#scroll-1-1 { top: 1px; left: 1px; }
#scroll-1-1-1 { top: 1px; left: 1px; }
#forceScroll { width: 5000px; height: 5000px; }
#marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; }
</style>
<script type="text/javascript" src="../../../dist/jquery.js"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
window.scrollTo(1000,1000);
$('#scroll-1')[0].scrollLeft = 5;
$('#scroll-1')[0].scrollTop = 5;
$('.scroll').click(function() {
$('#marker').css( $(this).offset() );
return false;
});
});
</script>
</head>
<body>
<div id="scroll-1" class="scroll">
<div id="scroll-1-1" class="scroll">
<div id="scroll-1-1-1" class="scroll"></div>
</div>
</div>
<div id="forceScroll"></div>
<div id="marker"></div>
</body>
</html>

28
test/data/offset/static.html Normal file
View file

@ -0,0 +1,28 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>static</title>
<style type="text/css" media="screen">
body { margin: 1px; padding: 5px; }
div.static { position: static; margin: 1px; border: 2px solid #000; padding: 5px; width: 100px; height: 100px; background: #fff; overflow: hidden; }
#static-2 { top: 20px; left: 20px; }
#marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; }
</style>
<script type="text/javascript" src="../../../dist/jquery.js"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
$('.static').click(function() {
$('#marker').css( $(this).offset() );
return false;
});
});
</script>
</head>
<body>
<div id="static-1" class="static"><div id="static-1-1" class="static"><div id="static-1-1-1" class="static"></div></div></div>
<div id="static-2" class="static"></div>
<div id="marker"></div>
</body>
</html>

42
test/data/offset/table.html Normal file
View file

@ -0,0 +1,42 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>table</title>
<style type="text/css" media="screen">
body { margin: 1px; padding: 5px; }
table { border: 2px solid #000; }
th, td { border: 1px solid #000; width: 100px; height: 100px; }
#marker { position: absolute; border: 2px solid #000; width: 50px; height: 50px; background: #ccc; }
</style>
<script type="text/javascript" src="../../../dist/jquery.js"></script>
<script type="text/javascript" charset="utf-8">
$(function() {
$('table, th, td').click(function() {
$('#marker').css( $(this).offset() );
return false;
});
});
</script>
</head>
<body>
<table id="table-1">
<thead>
<tr valign="top">
<th id="th-1">th-1</th>
<th id="th-2">th-2</th>
<th id="th-3">th-3</th>
</tr>
</thead>
<tbody>
<tr valign="top">
<td id="td-1">td-1</td>
<td id="td-2">td-2</td>
<td id="td-3">td-3</td>
</tr>
</tbody>
</table>
<div id="marker"></div>
</body>
</html>