Home arrow HTML arrow Page 2 - Completing the React Function of a Common Browser Menu
HTML

Completing the React Function of a Common Browser Menu


In this eighth part of a ten-part series on building a common browser menu, we treat the last code segment of the react() function. This is the last part of the in-depth analysis we are making of the react() function.

Author Info:
By: Chrysanthus Forcha
Rating: 5 stars5 stars5 stars5 stars5 stars / 1
April 24, 2009
TABLE OF CONTENTS:
  1. · Completing the React Function of a Common Browser Menu
  2. · Explanation of the Seventh Code Segment
  3. · Explanation of the Seventh Code Segment Continued
  4. · Cleaning Up for Previous Sub Menus

print this article
SEARCH DEVARTICLES

TOOLS YOU CAN USE

advertisement
Completing the React Function of a Common Browser Menu - Explanation of the Seventh Code Segment
(Page 2 of 4 )

Any sub menu is related to the menu item on which the mouse pointer hovered. The relationship is in the IDs of the SPAN elements and the IDs of the cell on which the mouse pointer sat. The aim of this segment is to clean the SPAN elements that are displayed, but are not supposed to be displayed. The segment starts by getting the row and column numbers of the cell on which the mouse pointer is resting. I call this the current cell.

The first statement gets the row number (digit) of the current cell in character form. This is assigned to the cellrowNo variable. The second statement gets the column number (digit) of the current cell in character form. This is assigned to the  cellColNo variable. The next statement gets the SPAN number (which includes the last two digits) of the SPAN number displayed in the current cell from the Number Table. The value is assigned to the spanNo variable. To achieve this, the statement uses the cellrowNo and cellColNo variables.

Next you have two for-loops, the inner one nested immediately to the outer one. These two for-loops will iterate through all the cells of our table and clean up any cell displaying a SPAN element from a sub menu that is no longer supposed to be displayed. All the SPAN numbers we talk about in this code segment include the last two digits.

I describe any SPAN number of a SPAN element that is not supposed to be displayed as Other-SPAN-Number. I use the otherSpanNo variable for this. Recall that the Number Table has SPAN numbers for SPAN elements that are displayed. When a new sub menu appears, the SPAN numbers of the previous sub menus are still in the number table and have to be removed immediately, that is before the react() function is through.

As the two for-loops iterates through all the cells of our table, for each cell, the corresponding SPAN number (if it exists) from the Number Table is assigned to the otherSpanNo variable. The first statement in the for-loops does this. From this statement, every SPAN number in the Number Table is assigned to the otherSpanNo variable. This means that the SPAN numbers of SPAN elements that are supposed to be displayed are also assigned in each iteration. We have to make the difference in order to clean up.


blog comments powered by Disqus
HTML ARTICLES

- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5
- BBC Adopts HTML 5, Mozilla Addresses Issues
- Advanced Sticky Footers in HTML and CSS
- HTML and CSS Sticky Footers
- Strategy Analytics Predicts HTML5 Phones to ...
- HTML5 Guidelines for Web Developers
- Learning HTML5 Game Programming
- More Engaging CSS3 and HTML Background Effec...
- Engaging HTML and CSS3 Background Effects
- More Web Columns with CSS3 and HTML
- Columns with CSS3 and HTML
- Creating Inline-Block HTML Elements with CSS
- Drag and Drop in HTML5: Parsing Local Files

Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 



© 2003-2012 by Developer Shed. All rights reserved. DS Cluster 1 - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials