1. First define a JavaScript function , as follows:
function pumperMenu(level) {var levelLength = ('row' + level).length;var toDo = '0';for (var iCount = 0 ; iCount < document.all.length; iCount++){if ( document.all[iCount].id.indexOf('row' + level) > -1 && ( document.all[iCount].id.length > levelLength)) {if ( document.all('level' + level).src.indexOf('minus.gif') > -1 ) {document.all[iCount].style.display = 'none';toDo = '1';} else {document.all[iCount].style.display = 'block';toDo = '0';}} }if ( toDo == '1' ) {document.all('level' + level).src = 'images/plus.gif'; } else {document.all('level' + level).src = 'images/minus.gif'; }} 2. Then define a div and an ul on the web page. Note that div should include an image with id starting with level and an onclick event. id in ul should include row , which is expanded by default. If it needs to be closed by default, you should add style="display:none" to ul
Examples are as follows:
<body><divstyle="CURSOR: hand"onclick="puckerMenu('1');"><IMGid=level1src="images/minus.gif">public class DataAccess</div><ulid=row1><li> private string connString;<divstyle="CURSOR: hand"onclick="puckerMenu('2');"><IMGid=level2src="images /plus.gif">protected DbConnection OpenConnection()</div><ulid=row2style="display:none">{...}</ul><li>Other</ul></body>Summarize
The above is all about this article, I hope it will be helpful to those in need. If you have any questions, please leave a message to discuss.