views:

45

answers:

2

Menu does not display in line. Not sure how to call the CSS code. Also I want the alert to tell me which menu item was clicked.

<script type="text/javascript">
function get_list() {
   $("#tabs").click(function(){
           $(this).click(function(){
              alert(this); 
           });
   });
</script>


<style type="text/css">
#navbarID li {
    display: inline;
}
</style>


</head>  
<body>  

<div id="tabs">
     <ul>
             <li><a href="type1.html">Type 1</a></li>
             <li><a href="type2.html">Type 2</a></li>
             <li><a href="type3.html">Type 3</a></li>
     </ul>
</div>

</body> 
</html>
A: 

alert($(this).html()); will tell you what the contents of that nav item are.
Maybe you should use <span> instead of <div> for inline.

bean
you're making the one who asked more confused.
Reigel
+2  A: 

the html should be something like this.

<ul id='tabs'>
<li><a href='type1.html'>Type 1</a></li>
<li><a href='type2.html'>Type 2</a></li>
<li><a href='type3.html'>Type 3</a></li>
<li><a href='type4.html'>Type 4</a></li>
</ul>

the css part could be this:

    ul#tabs { list-style: none; }
    ul#tabs li { display: inline; }

the onclick that you want on jQuery is like this:

 $('ul#tabs li a').click(function(){ alert('i was clicked!'); return false; });
Reigel
Reigel ...your code did the job. Thank you so very much! Also Bean suggested I add this: alert("U selected: "+$(this).html()); ...to tell me which menu item was selected. They all worked perfect. Thanks to you both. sonny5
sonny5