Welcome to Dream.In.Code
Getting Help is Easy!

Join 99,785 Programmers for FREE! Ask your question and get quick answers from experts. There are 1,574 online right now! We've got more than 500 tutorials and 2,000 snippets. Join and find out why Dream.In.Code is the #1 programming help community on the internet! Registration is fast and FREE... Join Now!



buid a dynamic drop down menu

 
Reply to this topicStart new topic

> buid a dynamic drop down menu, coldfusion and javascript

wiredwizard
Group Icon



post 9 Sep, 2005 - 05:55 AM
Post #1


<!--- I'm using the cfBookclub example database that comes with coldFusion --->

<!--- 1. build you query --->
<CFQUERY NAME="getMenus" DATASOURCE="cfbookclub">
Select TITLE, BOOKID
From BOOKS
</CFQUERY>


<html>
<head>


<!--- Set up Style for the elements --->
<style>
body{font-family:arial;}
table{font-size:80%}
a{color:black;text-decoration:none;font:bold}
a:hover{color:##9933ff}
td.menu{background:#ffffcc}
table.menu
{
font-size:100%;
position:absolute;
visibility:hidden;
}
</style>


<!--- the hide and show functions --->
<script type="text/javascript">
//show function
function showmenu(elmnt)
{
document.getElementById(elmnt).style.visibility="visible"
}
// hide function
function hidemenu(elmnt)
{
document.getElementById(elmnt).style.visibility="hidden"
}
</script>


</head>
<body>
<h3>Dynamic Drop Down</h3>
<table width="200">
<tr bgcolor="#99ffff">


<!--- notice the mouseover and mouse out effects --->
<td onmouseover="showmenu('nBooks')" onmouseout="hidemenu('nBooks')">
<a href="books.cfm">Books</a><br />


<!--- assign the id --->
<table class="menu" id="nBooks" width="120">


<!--- display query results --->
<cfoutput query="getMenus"><tr><td class="menu"><a href="display.cfm?id=#BOOKID#">#TITLE#</a></td></tr></cfoutput>
</table>
</td>
</tr>
</table>
</body>
</html>

<!--- and thats all there is to it --->


Register to Make This Ad Go Away!


Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Lo-Fi Version Time is now: 7/25/08 01:31AM

Live Help!

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

Bye Bye Ads

Free DIC T-Shirt

T-Shirt Example

Related Sites

Monthly Drawing

Thumb Drive

Partners

Top Contributors

Top 10 Kudos This Month
-->