"
Template:UCSF/Header
From 2010.igem.org
(Difference between revisions)
| (One intermediate revision not shown) | |||
| Line 4: | Line 4: | ||
font-size:12px; | font-size:12px; | ||
color:grey; | color:grey; | ||
| - | |||
} | } | ||
#TOCC{ | #TOCC{ | ||
| Line 10: | Line 9: | ||
} | } | ||
#tocDIV{ | #tocDIV{ | ||
| - | |||
margin-top:8px; | margin-top:8px; | ||
} | } | ||
| - | |||
#contentheader{ | #contentheader{ | ||
color:grey; | color:grey; | ||
| Line 20: | Line 17: | ||
cursor:pointer; | cursor:pointer; | ||
} | } | ||
| - | |||
#innertoc{ | #innertoc{ | ||
} | } | ||
| - | |||
.indent{ | .indent{ | ||
text-indent:8px; | text-indent:8px; | ||
| Line 34: | Line 29: | ||
margin-left:16px; | margin-left:16px; | ||
} | } | ||
| - | |||
.extraextraindent{ | .extraextraindent{ | ||
text-indent:24px; | text-indent:24px; | ||
| Line 40: | Line 34: | ||
margin-left:24px; | margin-left:24px; | ||
} | } | ||
| - | |||
</style> | </style> | ||
| + | <script> | ||
<script> | <script> | ||
function getElementsByTagNames(list,obj) { | function getElementsByTagNames(list,obj) { | ||
| Line 70: | Line 64: | ||
} | } | ||
| + | function createTOC() { | ||
| + | var y = document.createElement('div'); | ||
| + | y.id = 'innertoc'; | ||
| + | var a = document.createElement('a'); | ||
| + | a.innerHTML="<b>Page Content -</b>"; | ||
| + | a.id = 'contentheader'; | ||
| + | a.onclick = showhideTOC; | ||
| + | y.appendChild(a); | ||
| + | var z = y.appendChild(document.createElement('div')); | ||
| + | z.id='tocDIV'; | ||
| + | var bodycon = document.getElementById('Main'); | ||
| + | var toBeTOCced = getElementsByTagNames('h3,h4,h5',bodycon); | ||
| + | if (toBeTOCced.length < 2) return false; | ||
| + | |||
| + | for (var i=0;i<toBeTOCced.length;i++) { | ||
| + | var tmp = document.createElement('a'); | ||
| + | var reg = /<b>([^<]+)<\/b>/; | ||
| + | var str = toBeTOCced[i].innerHTML; | ||
| + | var result = reg.exec(str); | ||
| + | tmp.innerHTML = result[1]; | ||
| + | tmp.className = 'page'; | ||
| + | z.appendChild(tmp); | ||
| + | z.appendChild(document.createElement('br')); | ||
| + | if (toBeTOCced[i].nodeName == 'H4') | ||
| + | tmp.className += ' indent'; | ||
| + | if (toBeTOCced[i].nodeName == 'H5') | ||
| + | tmp.className += ' extraindent'; | ||
| + | var headerId = result[1]; | ||
| + | tmp.href = '#' + headerId; | ||
| + | toBeTOCced[i].id = headerId; | ||
| + | if (toBeTOCced[i].nodeName == 'H2') { | ||
| + | tmp.innerHTML = 'Top'; | ||
| + | tmp.href = '#top'; | ||
| + | toBeTOCced[i].id = 'top'; | ||
| + | } | ||
| + | } | ||
| + | return y; | ||
| + | } | ||
var TOCstate = 'block'; | var TOCstate = 'block'; | ||
| + | |||
| + | function showhideTOC() { | ||
| + | TOCstate = (TOCstate == 'none') ? 'block' : 'none'; | ||
| + | var newText = (TOCstate == 'none') ? 'Page Content +' : 'Page Content -'; | ||
| + | document.getElementById('contentheader').innerHTML = '<strong>'+newText+'</strong>'; | ||
| + | document.getElementById('innertoc').lastChild.style.display = TOCstate; | ||
| + | } | ||
</script> | </script> | ||
| - | |||
| - | |||
<style> | <style> | ||
body{ | body{ | ||
background-color:#494d51; | background-color:#494d51; | ||
} | } | ||
| - | |||
#content{ | #content{ | ||
padding-right:10px; | padding-right:10px; | ||
| Line 86: | Line 122: | ||
background: #ECF4EA; | background: #ECF4EA; | ||
} | } | ||
| - | |||
h1{ | h1{ | ||
font-weight:normal; | font-weight:normal; | ||
| Line 92: | Line 127: | ||
float:right; | float:right; | ||
} | } | ||
| - | |||
h2{ | h2{ | ||
font-weight:normal; | font-weight:normal; | ||
| Line 98: | Line 132: | ||
text-indent: 10px; | text-indent: 10px; | ||
} | } | ||
| - | |||
p, pre{ | p, pre{ | ||
margin-left:35px; | margin-left:35px; | ||
| Line 331: | Line 364: | ||
</script> | </script> | ||
| - | <div style="float:left;width: | + | <div style="float:left;width:705px;margin-top:5px; |
background-image: url(https://static.igem.org/mediawiki/2010/d/dc/UCSF-SF-GGB.jpg); | background-image: url(https://static.igem.org/mediawiki/2010/d/dc/UCSF-SF-GGB.jpg); | ||
background-repeat:no-repeat;" id="Main"> | background-repeat:no-repeat;" id="Main"> | ||
</html> | </html> | ||
Latest revision as of 09:47, 23 October 2010
