1 <!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN"
2 "http://www.w3.org/TR/html4/strict.dtd">
5 <meta http-equiv=
"Content-type" content=
"text/html; charset=utf-8">
6 <title>jQuery bgiframe Visual Test
</title>
8 <!-- load latest build of jquery.js -->
9 <script type=
"text/javascript" src=
"../../../jquery/dist/jquery.js"></script>
11 <!-- load dimensions.js (this is what we're testing! -->
12 <script type=
"text/javascript" src=
"../jquery.bgiframe.js"></script>
14 <!-- load firebug lite
15 <script type="text/javascript" src="http://brandon.jquery.com/firebuglite/firebug.js"></script>-->
17 <link rel=
"Stylesheet" media=
"screen" href=
"../../../jquery/test/data/testsuite.css" />
19 <script type=
"text/javascript" charset=
"utf-8">
21 $('#userAgent').html(navigator.userAgent);
22 $('#box2').bgiframe();
23 $('#box3').bgiframe({top: -
5, left: -
5});
24 $('#box4').bgiframe({top: -
5, left: -
5, width:
270, height:
120});
25 $('#box5').bgiframe({top:
0, left:
0, width:
260, height:
110});
26 $('#box6').bgiframe({top: '-
5px', left: '-
5px', width: '
270px', height: '
120px'});
27 $('#box7').bgiframe({top: '-
.5em', left: '-
.5em', width: '
17em', height: '
12em'});
28 $('#box8').bgiframe({top: '-
.5em', left: '-
.5em'});
29 $('#box9').bgiframe({opacity:false});
33 <style type=
"text/css" media=
"screen">
34 #wrapper { position: relative; width:
100%; font:
12px Arial; }
35 form { position: absolute; top:
0; left:
0; width:
100%; }
36 select { position: relative; width:
100%; margin:
0 0 2px; z-index:
1; }
38 .box { position: relative; z-index:
2; float: left; margin:
5px; border:
5px solid #
666; padding:
5px; width:
250px; height:
100px; color: #
000; background-color: #
999; }
39 dl { margin:
0; padding:
0; }
40 dt { float: left; margin:
0; padding:
0; width:
50px; }
41 dd { margin:
0; padding:
0; }
42 #box7, #box8 { border-width:
.5em; padding:
.5em; width:
15em; height:
10em; }
46 <h1 id=
"banner">jQuery bgiframe - Visual Test
</h1>
47 <h2 id=
"userAgent"></h2>
49 <form action=
"#" method=
"get" accept-charset=
"utf-8">
50 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
51 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
52 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
53 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
54 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
55 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
56 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
57 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
58 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
59 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
60 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
61 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
62 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
63 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
64 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
65 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
66 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
67 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
68 <select name=
"test"><option>Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing Testing
</option></select>
71 <div id=
"box1" class=
"box">nothing
</div>
72 <div id=
"box2" class=
"box">
87 <div id=
"box3" class=
"box">
102 <div id=
"box4" class=
"box">
117 <div id=
"box5" class=
"box">
132 <div id=
"box6" class=
"box">
147 <div id=
"box7" class=
"box">
162 <div id=
"box8" class=
"box">
177 <div id=
"box9" class=
"box">