If there are too long messages in the message board, the page will be very long. Do you think it is uncomfortable for those long message boards? Every time you have to pick up the scroll bars many times.
If only the title appears at the beginning, you can click the title to see the content below (note that it is not a pop-up window). Is this good!
Next, let's take a look at how to implement:
First, set the ID of each title and content. This is the ID of the first message. We set the title ID to td1 and the content to tdd1.
<TR align = left id = td1 onclick = goit (tdd1) onmouseout = noit (td1) onmouseover = onit (td1) style = "CURSOR: hand" bgcolor = # C8E7BA>
<Td vAlign = middle> here is the title </TD>
</TR>
<TR>
<TD class = zw id = tdd1 bgcolor = # fffoce> here is the content
<DIV align = right>
<A class = btn href = "# tob0" onclick = goit (tdd1)> close </A>
</DIV>
</TD>
</TR>
"Onclick = goit (tdd1) onmouseout = noit (td1) onmouseover = onit (td1 )"
The three sentences are the mouse event. noit () and onit () only change the color. goit () Is the function to open or close the content. The specific function is as follows:
<SCRIPT language = "JavaScript">
<! --
Function onit (o) {o. runtimeStyle. backgroundColor = '# FFBB66 '}
Function noit (o) {o. runtimeStyle. backgroundColor = '# C8E7BA '}
Function goit (o ){
If (o. style. display = 'None '){
O. style. display =''
}
Else {
O. style. display = 'none'
}
}
-->
</SCRIPT>
In the end, don't forget. Initializing your page is to hide the content first."
<Script language = "JavaScript">
Goit (tdd1); goit (tdd2 );............
</Script>