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">