Click "Show message text box" below to show message box, click again to hide message box. So this will save a lot of content space.
Show message text box
Welcome to Jiansen Lu blogs
<style type="text/css">
<!--
.hidden { display: none; }
.displayed {
background-color: #F4F4F4;
border: 1px solid #CCC;
height: 200px;
width: 300px;
padding: 5px;
display: block;
}
-->
</style>
<script type="text/javascript">
function display2(divID) {
var item = document.getElementById(divID);
if (item) {
document.getElementById('toggletext2').innerHTML =(item.className=='hidden')?'Hide quoted text box':'Show quoted text box';
item.className=(item.className=='hidden')?'displayed':'hidden';
}
}
</script>
<a href="javascript:display2('testcode2');" id="toggletext2">Show quoted text box</a>
<div class="hidden" id="testcode2">
<h1>
Welcome to Jiansen Lu blogs</h1>
</div>
No comments:
Post a Comment