<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>::: link.innerHTML :::</title>
<script type="text/javascript">
<!--
function getObject(id){
return document.getElementById(id);
}
function toggleTextBox(link, divId){
var lTextBox = link.innerHTML;
var d = getObject(divId);
if(lTextBox == 'ausblenden'){
link.innerHTML = 'einblenden';
d.style.display = 'none';
}else{
link.innerHTML = 'ausblenden';
d.style.display = 'block';
}
}
//-->
</script>
<style type="text/css">
<!--
div.outerBox {
position:relative;
width:400px;
margin:40px auto;
border:1px solid #d0d0d0;
background:#ededed;
}
div.titleBox {
float:left;
padding:2px 5px;
font-weight:bold;
}
div.linkBox {
float:right;
padding:2px 5px;
font-weight:bold;
}
div.linkBox a:link, div.linkBox a:visited {
text-decoration:none;
color:#3f3f3f;
}
div.linkBox a:hover {
color:#252525;
}
div.textBox {
display:none;
padding:5px;
background:#fff;
}
/* clearfix-Technik zum Clearing der Floats */
.clearfix:after {
content:".";
display:block;
height:0;
font-size:0;
clear:both;
visibility:hidden;
}
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */
/* Ende clearfix-Technik zum Clearing der Floats */
-->
</style>
</head>
<body>
<div class="outerBox">
<div class="innerBox clearfix">
<div class="titleBox">
Textbox 1
</div>
<div class="linkBox">
» <a href="#" onclick="toggleTextBox(this, 'box1');return false;">einblenden</a>
</div>
</div>
<div id="box1" class="textBox">
Inhalt von Textbox 1, der ein- und ausgeblendet werden kann.
</div>
</div>
<div class="outerBox">
<div class="innerBox clearfix">
<div class="titleBox">
Textbox 2
</div>
<div class="linkBox">
» <a href="#" onclick="toggleTextBox(this, 'box2');return false;">einblenden</a>
</div>
</div>
<div id="box2" class="textBox">
Inhalt von Textbox 2, der ein- und ausgeblendet werden kann.
</div>
</div>
<div class="outerBox">
<div class="innerBox clearfix">
<div class="titleBox">
Textbox 3
</div>
<div class="linkBox">
» <a href="#" onclick="toggleTextBox(this, 'box3');return false;">einblenden</a>
</div>
</div>
<div id="box3" class="textBox">
Inhalt von Textbox 3, der ein- und ausgeblendet werden kann.
</div>
</div>
</body>
</html>