WebSVN – lars-tiefland.zeldi.de_alt – Blame – /trunk/public/JavaScript/DataTables-1.10.5/extensions/FixedHeader/examples/header_footer.html

Revision	Autor	Zeilennr.	Zeile
2	lars	1	`<!DOCTYPE html>`
		2	`<html>`
		3	`<head>`
		4	`<meta charset="utf-8">`
		5	`<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">`
		6	`<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0">`
		7
		8	`<title>FixedHeader example - Header and footer fixed</title>`
		9	`<link rel="stylesheet" type="text/css" href="../../../media/css/jquery.dataTables.css">`
		10	`<link rel="stylesheet" type="text/css" href="../css/dataTables.fixedHeader.css">`
		11	`<link rel="stylesheet" type="text/css" href="../../../examples/resources/syntax/shCore.css">`
		12	`<link rel="stylesheet" type="text/css" href="../../../examples/resources/demo.css">`
		13	`<style type="text/css" class="init">`
		14
		15	`</style>`
		16	`<script type="text/javascript" language="javascript" src="../../../media/js/jquery.js"></script>`
		17	`<script type="text/javascript" language="javascript" src="../../../media/js/jquery.dataTables.js"></script>`
		18	`<script type="text/javascript" language="javascript" src="../js/dataTables.fixedHeader.js"></script>`
		19	`<script type="text/javascript" language="javascript" src="../../../examples/resources/syntax/shCore.js"></script>`
		20	`<script type="text/javascript" language="javascript" src="../../../examples/resources/demo.js"></script>`
		21	`<script type="text/javascript" language="javascript" class="init">`
		22
		23
		24	`$(document).ready(function() {`
		25	`var table = $('#example').DataTable();`
		26
		27	`new $.fn.dataTable.FixedHeader( table, {`
		28	`bottom: true`
		29	`} );`
		30	`} );`
		31
		32
		33	`</script>`
		34	`</head>`
		35
		36	`<body class="dt-example">`
		37	`<div class="container">`
		38	`<section>`
		39	`<h1>FixedHeader example <span>Header and footer fixed</span></h1>`
		40
		41	`<div class="info">`
		42	`<p>FixedHeader provides the ability to fix in place the header, footer, left and right columns of the`
		43	`table. These are controlled by the options:</p>`
		44
		45	`<ul class="markdown">`
		46	`<li><code>top</code> - default true</li>`
		47	`<li><code>bottom</code> - default false</li>`
		48	`<li><code>left</code> - default false</li>`
		49	`<li><code>right</code> - default false</li>`
		50	`</ul>`
		51
		52	`<p>This example shows the header and footer of the table fixed by enabling the <code>bottom</code>`
		53	`option.</p>`
		54	`</div>`
		55
		56	`<table id="example" class="display" cellspacing="0" width="100%">`
		57	`<thead>`
		58	`<tr>`
		59	`<th>Name</th>`
		60	`<th>Position</th>`
		61	`<th>Office</th>`
		62	`<th>Age</th>`
		63	`<th>Start date</th>`
		64	`<th>Salary</th>`
		65	`</tr>`
		66	`</thead>`
		67
		68	`<tfoot>`
		69	`<tr>`
		70	`<th>Name</th>`
		71	`<th>Position</th>`
		72	`<th>Office</th>`
		73	`<th>Age</th>`
		74	`<th>Start date</th>`
		75	`<th>Salary</th>`
		76	`</tr>`
		77	`</tfoot>`
		78
		79	`<tbody>`
		80	`<tr>`
		81	`<td>Tiger Nixon</td>`
		82	`<td>System Architect</td>`
		83	`<td>Edinburgh</td>`
		84	`<td>61</td>`
		85	`<td>2011/04/25</td>`
		86	`<td>$320,800</td>`
		87	`</tr>`
		88	`<tr>`
		89	`<td>Garrett Winters</td>`
		90	`<td>Accountant</td>`
		91	`<td>Tokyo</td>`
		92	`<td>63</td>`
		93	`<td>2011/07/25</td>`
		94	`<td>$170,750</td>`
		95	`</tr>`
		96	`<tr>`
		97	`<td>Ashton Cox</td>`
		98	`<td>Junior Technical Author</td>`
		99	`<td>San Francisco</td>`
		100	`<td>66</td>`
		101	`<td>2009/01/12</td>`
		102	`<td>$86,000</td>`
		103	`</tr>`
		104	`<tr>`
		105	`<td>Cedric Kelly</td>`
		106	`<td>Senior Javascript Developer</td>`
		107	`<td>Edinburgh</td>`
		108	`<td>22</td>`
		109	`<td>2012/03/29</td>`
		110	`<td>$433,060</td>`
		111	`</tr>`
		112	`<tr>`
		113	`<td>Airi Satou</td>`
		114	`<td>Accountant</td>`
		115	`<td>Tokyo</td>`
		116	`<td>33</td>`
		117	`<td>2008/11/28</td>`
		118	`<td>$162,700</td>`
		119	`</tr>`
		120	`<tr>`
		121	`<td>Brielle Williamson</td>`
		122	`<td>Integration Specialist</td>`
		123	`<td>New York</td>`
		124	`<td>61</td>`
		125	`<td>2012/12/02</td>`
		126	`<td>$372,000</td>`
		127	`</tr>`
		128	`<tr>`
		129	`<td>Herrod Chandler</td>`
		130	`<td>Sales Assistant</td>`
		131	`<td>San Francisco</td>`
		132	`<td>59</td>`
		133	`<td>2012/08/06</td>`
		134	`<td>$137,500</td>`
		135	`</tr>`
		136	`<tr>`
		137	`<td>Rhona Davidson</td>`
		138	`<td>Integration Specialist</td>`
		139	`<td>Tokyo</td>`
		140	`<td>55</td>`
		141	`<td>2010/10/14</td>`
		142	`<td>$327,900</td>`
		143	`</tr>`
		144	`<tr>`
		145	`<td>Colleen Hurst</td>`
		146	`<td>Javascript Developer</td>`
		147	`<td>San Francisco</td>`
		148	`<td>39</td>`
		149	`<td>2009/09/15</td>`
		150	`<td>$205,500</td>`
		151	`</tr>`
		152	`<tr>`
		153	`<td>Sonya Frost</td>`
		154	`<td>Software Engineer</td>`
		155	`<td>Edinburgh</td>`
		156	`<td>23</td>`
		157	`<td>2008/12/13</td>`
		158	`<td>$103,600</td>`
		159	`</tr>`
		160	`<tr>`
		161	`<td>Jena Gaines</td>`
		162	`<td>Office Manager</td>`
		163	`<td>London</td>`
		164	`<td>30</td>`
		165	`<td>2008/12/19</td>`
		166	`<td>$90,560</td>`
		167	`</tr>`
		168	`<tr>`
		169	`<td>Quinn Flynn</td>`
		170	`<td>Support Lead</td>`
		171	`<td>Edinburgh</td>`
		172	`<td>22</td>`
		173	`<td>2013/03/03</td>`
		174	`<td>$342,000</td>`
		175	`</tr>`
		176	`<tr>`
		177	`<td>Charde Marshall</td>`
		178	`<td>Regional Director</td>`
		179	`<td>San Francisco</td>`
		180	`<td>36</td>`
		181	`<td>2008/10/16</td>`
		182	`<td>$470,600</td>`
		183	`</tr>`
		184	`<tr>`
		185	`<td>Haley Kennedy</td>`
		186	`<td>Senior Marketing Designer</td>`
		187	`<td>London</td>`
		188	`<td>43</td>`
		189	`<td>2012/12/18</td>`
		190	`<td>$313,500</td>`
		191	`</tr>`
		192	`<tr>`
		193	`<td>Tatyana Fitzpatrick</td>`
		194	`<td>Regional Director</td>`
		195	`<td>London</td>`
		196	`<td>19</td>`
		197	`<td>2010/03/17</td>`
		198	`<td>$385,750</td>`
		199	`</tr>`
		200	`<tr>`
		201	`<td>Michael Silva</td>`
		202	`<td>Marketing Designer</td>`
		203	`<td>London</td>`
		204	`<td>66</td>`
		205	`<td>2012/11/27</td>`
		206	`<td>$198,500</td>`
		207	`</tr>`
		208	`<tr>`
		209	`<td>Paul Byrd</td>`
		210	`<td>Chief Financial Officer (CFO)</td>`
		211	`<td>New York</td>`
		212	`<td>64</td>`
		213	`<td>2010/06/09</td>`
		214	`<td>$725,000</td>`
		215	`</tr>`
		216	`<tr>`
		217	`<td>Gloria Little</td>`
		218	`<td>Systems Administrator</td>`
		219	`<td>New York</td>`
		220	`<td>59</td>`
		221	`<td>2009/04/10</td>`
		222	`<td>$237,500</td>`
		223	`</tr>`
		224	`<tr>`
		225	`<td>Bradley Greer</td>`
		226	`<td>Software Engineer</td>`
		227	`<td>London</td>`
		228	`<td>41</td>`
		229	`<td>2012/10/13</td>`
		230	`<td>$132,000</td>`
		231	`</tr>`
		232	`<tr>`
		233	`<td>Dai Rios</td>`
		234	`<td>Personnel Lead</td>`
		235	`<td>Edinburgh</td>`
		236	`<td>35</td>`
		237	`<td>2012/09/26</td>`
		238	`<td>$217,500</td>`
		239	`</tr>`
		240	`<tr>`
		241	`<td>Jenette Caldwell</td>`
		242	`<td>Development Lead</td>`
		243	`<td>New York</td>`
		244	`<td>30</td>`
		245	`<td>2011/09/03</td>`
		246	`<td>$345,000</td>`
		247	`</tr>`
		248	`<tr>`
		249	`<td>Yuri Berry</td>`
		250	`<td>Chief Marketing Officer (CMO)</td>`
		251	`<td>New York</td>`
		252	`<td>40</td>`
		253	`<td>2009/06/25</td>`
		254	`<td>$675,000</td>`
		255	`</tr>`
		256	`<tr>`
		257	`<td>Caesar Vance</td>`
		258	`<td>Pre-Sales Support</td>`
		259	`<td>New York</td>`
		260	`<td>21</td>`
		261	`<td>2011/12/12</td>`
		262	`<td>$106,450</td>`
		263	`</tr>`
		264	`<tr>`
		265	`<td>Doris Wilder</td>`
		266	`<td>Sales Assistant</td>`
		267	`<td>Sidney</td>`
		268	`<td>23</td>`
		269	`<td>2010/09/20</td>`
		270	`<td>$85,600</td>`
		271	`</tr>`
		272	`<tr>`
		273	`<td>Angelica Ramos</td>`
		274	`<td>Chief Executive Officer (CEO)</td>`
		275	`<td>London</td>`
		276	`<td>47</td>`
		277	`<td>2009/10/09</td>`
		278	`<td>$1,200,000</td>`
		279	`</tr>`
		280	`<tr>`
		281	`<td>Gavin Joyce</td>`
		282	`<td>Developer</td>`
		283	`<td>Edinburgh</td>`
		284	`<td>42</td>`
		285	`<td>2010/12/22</td>`
		286	`<td>$92,575</td>`
		287	`</tr>`
		288	`<tr>`
		289	`<td>Jennifer Chang</td>`
		290	`<td>Regional Director</td>`
		291	`<td>Singapore</td>`
		292	`<td>28</td>`
		293	`<td>2010/11/14</td>`
		294	`<td>$357,650</td>`
		295	`</tr>`
		296	`<tr>`
		297	`<td>Brenden Wagner</td>`
		298	`<td>Software Engineer</td>`
		299	`<td>San Francisco</td>`
		300	`<td>28</td>`
		301	`<td>2011/06/07</td>`
		302	`<td>$206,850</td>`
		303	`</tr>`
		304	`<tr>`
		305	`<td>Fiona Green</td>`
		306	`<td>Chief Operating Officer (COO)</td>`
		307	`<td>San Francisco</td>`
		308	`<td>48</td>`
		309	`<td>2010/03/11</td>`
		310	`<td>$850,000</td>`
		311	`</tr>`
		312	`<tr>`
		313	`<td>Shou Itou</td>`
		314	`<td>Regional Marketing</td>`
		315	`<td>Tokyo</td>`
		316	`<td>20</td>`
		317	`<td>2011/08/14</td>`
		318	`<td>$163,000</td>`
		319	`</tr>`
		320	`<tr>`
		321	`<td>Michelle House</td>`
		322	`<td>Integration Specialist</td>`
		323	`<td>Sidney</td>`
		324	`<td>37</td>`
		325	`<td>2011/06/02</td>`
		326	`<td>$95,400</td>`
		327	`</tr>`
		328	`<tr>`
		329	`<td>Suki Burks</td>`
		330	`<td>Developer</td>`
		331	`<td>London</td>`
		332	`<td>53</td>`
		333	`<td>2009/10/22</td>`
		334	`<td>$114,500</td>`
		335	`</tr>`
		336	`<tr>`
		337	`<td>Prescott Bartlett</td>`
		338	`<td>Technical Author</td>`
		339	`<td>London</td>`
		340	`<td>27</td>`
		341	`<td>2011/05/07</td>`
		342	`<td>$145,000</td>`
		343	`</tr>`
		344	`<tr>`
		345	`<td>Gavin Cortez</td>`
		346	`<td>Team Leader</td>`
		347	`<td>San Francisco</td>`
		348	`<td>22</td>`
		349	`<td>2008/10/26</td>`
		350	`<td>$235,500</td>`
		351	`</tr>`
		352	`<tr>`
		353	`<td>Martena Mccray</td>`
		354	`<td>Post-Sales support</td>`
		355	`<td>Edinburgh</td>`
		356	`<td>46</td>`
		357	`<td>2011/03/09</td>`
		358	`<td>$324,050</td>`
		359	`</tr>`
		360	`<tr>`
		361	`<td>Unity Butler</td>`
		362	`<td>Marketing Designer</td>`
		363	`<td>San Francisco</td>`
		364	`<td>47</td>`
		365	`<td>2009/12/09</td>`
		366	`<td>$85,675</td>`
		367	`</tr>`
		368	`<tr>`
		369	`<td>Howard Hatfield</td>`
		370	`<td>Office Manager</td>`
		371	`<td>San Francisco</td>`
		372	`<td>51</td>`
		373	`<td>2008/12/16</td>`
		374	`<td>$164,500</td>`
		375	`</tr>`
		376	`<tr>`
		377	`<td>Hope Fuentes</td>`
		378	`<td>Secretary</td>`
		379	`<td>San Francisco</td>`
		380	`<td>41</td>`
		381	`<td>2010/02/12</td>`
		382	`<td>$109,850</td>`
		383	`</tr>`
		384	`<tr>`
		385	`<td>Vivian Harrell</td>`
		386	`<td>Financial Controller</td>`
		387	`<td>San Francisco</td>`
		388	`<td>62</td>`
		389	`<td>2009/02/14</td>`
		390	`<td>$452,500</td>`
		391	`</tr>`
		392	`<tr>`
		393	`<td>Timothy Mooney</td>`
		394	`<td>Office Manager</td>`
		395	`<td>London</td>`
		396	`<td>37</td>`
		397	`<td>2008/12/11</td>`
		398	`<td>$136,200</td>`
		399	`</tr>`
		400	`<tr>`
		401	`<td>Jackson Bradshaw</td>`
		402	`<td>Director</td>`
		403	`<td>New York</td>`
		404	`<td>65</td>`
		405	`<td>2008/09/26</td>`
		406	`<td>$645,750</td>`
		407	`</tr>`
		408	`<tr>`
		409	`<td>Olivia Liang</td>`
		410	`<td>Support Engineer</td>`
		411	`<td>Singapore</td>`
		412	`<td>64</td>`
		413	`<td>2011/02/03</td>`
		414	`<td>$234,500</td>`
		415	`</tr>`
		416	`<tr>`
		417	`<td>Bruno Nash</td>`
		418	`<td>Software Engineer</td>`
		419	`<td>London</td>`
		420	`<td>38</td>`
		421	`<td>2011/05/03</td>`
		422	`<td>$163,500</td>`
		423	`</tr>`
		424	`<tr>`
		425	`<td>Sakura Yamamoto</td>`
		426	`<td>Support Engineer</td>`
		427	`<td>Tokyo</td>`
		428	`<td>37</td>`
		429	`<td>2009/08/19</td>`
		430	`<td>$139,575</td>`
		431	`</tr>`
		432	`<tr>`
		433	`<td>Thor Walton</td>`
		434	`<td>Developer</td>`
		435	`<td>New York</td>`
		436	`<td>61</td>`
		437	`<td>2013/08/11</td>`
		438	`<td>$98,540</td>`
		439	`</tr>`
		440	`<tr>`
		441	`<td>Finn Camacho</td>`
		442	`<td>Support Engineer</td>`
		443	`<td>San Francisco</td>`
		444	`<td>47</td>`
		445	`<td>2009/07/07</td>`
		446	`<td>$87,500</td>`
		447	`</tr>`
		448	`<tr>`
		449	`<td>Serge Baldwin</td>`
		450	`<td>Data Coordinator</td>`
		451	`<td>Singapore</td>`
		452	`<td>64</td>`
		453	`<td>2012/04/09</td>`
		454	`<td>$138,575</td>`
		455	`</tr>`
		456	`<tr>`
		457	`<td>Zenaida Frank</td>`
		458	`<td>Software Engineer</td>`
		459	`<td>New York</td>`
		460	`<td>63</td>`
		461	`<td>2010/01/04</td>`
		462	`<td>$125,250</td>`
		463	`</tr>`
		464	`<tr>`
		465	`<td>Zorita Serrano</td>`
		466	`<td>Software Engineer</td>`
		467	`<td>San Francisco</td>`
		468	`<td>56</td>`
		469	`<td>2012/06/01</td>`
		470	`<td>$115,000</td>`
		471	`</tr>`
		472	`<tr>`
		473	`<td>Jennifer Acosta</td>`
		474	`<td>Junior Javascript Developer</td>`
		475	`<td>Edinburgh</td>`
		476	`<td>43</td>`
		477	`<td>2013/02/01</td>`
		478	`<td>$75,650</td>`
		479	`</tr>`
		480	`<tr>`
		481	`<td>Cara Stevens</td>`
		482	`<td>Sales Assistant</td>`
		483	`<td>New York</td>`
		484	`<td>46</td>`
		485	`<td>2011/12/06</td>`
		486	`<td>$145,600</td>`
		487	`</tr>`
		488	`<tr>`
		489	`<td>Hermione Butler</td>`
		490	`<td>Regional Director</td>`
		491	`<td>London</td>`
		492	`<td>47</td>`
		493	`<td>2011/03/21</td>`
		494	`<td>$356,250</td>`
		495	`</tr>`
		496	`<tr>`
		497	`<td>Lael Greer</td>`
		498	`<td>Systems Administrator</td>`
		499	`<td>London</td>`
		500	`<td>21</td>`
		501	`<td>2009/02/27</td>`
		502	`<td>$103,500</td>`
		503	`</tr>`
		504	`<tr>`
		505	`<td>Jonas Alexander</td>`
		506	`<td>Developer</td>`
		507	`<td>San Francisco</td>`
		508	`<td>30</td>`
		509	`<td>2010/07/14</td>`
		510	`<td>$86,500</td>`
		511	`</tr>`
		512	`<tr>`
		513	`<td>Shad Decker</td>`
		514	`<td>Regional Director</td>`
		515	`<td>Edinburgh</td>`
		516	`<td>51</td>`
		517	`<td>2008/11/13</td>`
		518	`<td>$183,000</td>`
		519	`</tr>`
		520	`<tr>`
		521	`<td>Michael Bruce</td>`
		522	`<td>Javascript Developer</td>`
		523	`<td>Singapore</td>`
		524	`<td>29</td>`
		525	`<td>2011/06/27</td>`
		526	`<td>$183,000</td>`
		527	`</tr>`
		528	`<tr>`
		529	`<td>Donna Snider</td>`
		530	`<td>Customer Support</td>`
		531	`<td>New York</td>`
		532	`<td>27</td>`
		533	`<td>2011/01/25</td>`
		534	`<td>$112,000</td>`
		535	`</tr>`
		536	`</tbody>`
		537	`</table>`
		538
		539	`<ul class="tabs">`
		540	`<li class="active">Javascript</li>`
		541	`<li>HTML</li>`
		542	`<li>CSS</li>`
		543	`<li>Ajax</li>`
		544	`<li>Server-side script</li>`
		545	`</ul>`
		546
		547	`<div class="tabs">`
		548	`<div class="js">`
		549	`<p>The Javascript shown below is used to initialise the table shown in this`
		550	`example:</p><code class="multiline brush: js;">$(document).ready(function() {`
		551	`var table = $('#example').DataTable();`
		552
		553	`new $.fn.dataTable.FixedHeader( table, {`
		554	`bottom: true`
		555	`} );`
		556	`} );</code>`
		557
		558	`<p>In addition to the above code, the following Javascript library files are loaded for use in this`
		559	`example:</p>`
		560
		561	`<ul>`
		562	`<li><a href="../../../media/js/jquery.js">../../../media/js/jquery.js</a></li>`
		563	`<li><a href=`
		564	`"../../../media/js/jquery.dataTables.js">../../../media/js/jquery.dataTables.js</a></li>`
		565	`<li><a href="../js/dataTables.fixedHeader.js">../js/dataTables.fixedHeader.js</a></li>`
		566	`</ul>`
		567	`</div>`
		568
		569	`<div class="table">`
		570	`<p>The HTML shown below is the raw HTML table element, before it has been enhanced by`
		571	`DataTables:</p>`
		572	`</div>`
		573
		574	`<div class="css">`
		575	`<div>`
		576	`<p>This example uses a little bit of additional CSS beyond what is loaded from the library`
		577	`files (below), in order to correctly display the table. The additional CSS used is shown`
		578	`below:</p><code class="multiline brush: js;"></code>`
		579	`</div>`
		580
		581	`<p>The following CSS library files are loaded for use in this example to provide the styling of the`
		582	`table:</p>`
		583
		584	`<ul>`
		585	`<li><a href=`
		586	`"../../../media/css/jquery.dataTables.css">../../../media/css/jquery.dataTables.css</a></li>`
		587	`<li><a href="../css/dataTables.fixedHeader.css">../css/dataTables.fixedHeader.css</a></li>`
		588	`</ul>`
		589	`</div>`
		590
		591	`<div class="ajax">`
		592	`<p>This table loads data by Ajax. The latest data that has been loaded is shown below. This data`
		593	`will update automatically as any additional data is loaded.</p>`
		594	`</div>`
		595
		596	`<div class="php">`
		597	`<p>The script used to perform the server-side processing for this table is shown below. Please note`
		598	`that this is just an example script using PHP. Server-side processing scripts can be written in any`
		599	`language, using <a href="//datatables.net/manual/server-side">the protocol described in the`
		600	`DataTables documentation</a>.</p>`
		601	`</div>`
		602	`</div>`
		603	`</section>`
		604	`</div>`
		605
		606	`<section>`
		607	`<div class="footer">`
		608	`<div class="gradient"></div>`
		609
		610	`<div class="liner">`
		611	`<h2>Other examples</h2>`
		612
		613	`<div class="toc">`
		614	`<div class="toc-group">`
		615	`<h3><a href="./index.html">Examples</a></h3>`
		616	`<ul class="toc active">`
		617	`<li><a href="./simple.html">Basic initialisation</a></li>`
		618	`<li class="active"><a href="./header_footer.html">Header and footer fixed</a></li>`
		619	`<li><a href="./top_left_right.html">Header, left and right all fixed</a></li>`
		620	`<li><a href="./two_tables.html">Multiple tables</a></li>`
		621	`<li><a href="./zIndexes.html">z-index order control</a></li>`
		622	`</ul>`
		623	`</div>`
		624	`</div>`
		625
		626	`<div class="epilogue">`
		627	`<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full`
		628	`information about its API properties and methods.<br>`
		629	`Additionally, there are a wide range of <a href="http://www.datatables.net/extras">extras</a> and`
		630	`<a href="http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of`
		631	`DataTables.</p>`
		632
		633	`<p class="copyright">DataTables designed and created by <a href=`
		634	`"http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2014<br>`
		635	`DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>`
		636	`</div>`
		637	`</div>`
		638	`</div>`
		639	`</section>`
		640	`</body>`
		641	`</html>`

Subversion-Projekte lars-tiefland.zeldi.de_alt

(root)/trunk/public/JavaScript/DataTables-1.10.5/extensions/FixedHeader/examples/header_footer.html – Revision 2