| Back to top |
I'm working on a site for a restaurant. The site calls for 2 menus at the moment, the lunch menu and the dinner menu. I created a script that would dynamically change the menu images according to the page number clicked, that way there isn't a separate page for each menu page or the need for the page to be refreshed to see the next menu page.
Only 2 things need to be changed and they're both classes of divs with ids. I call the div by its id and then change its class by whatever page number is clicked. I then change the link to a different color, again by changing the class, to show that it is the current page. The function works for both lunch and dinner menus, as you will see. Here is the code: :: Code ::
function changeMenu(menu,number){ if(menu == "lunch"){ c = "lc"; p = "lp"; } else if(menu == "dinner"){ c = "dc"; p = "dp"; } cont = document.getElementById(c); pageImg = document.getElementById('bot'); link1 = document.getElementById('one'); link2 = document.getElementById('two'); link3 = document.getElementById('three'); if(number == 1){ link1.class="sbover"; } else if(number == 2){ link2.class="sbover"; } else if(number == 3){ link3.class="sbover"; } else{ number=1; link1.class="sbhover"; } cont.class=c.number; pageImg.class=p.number; } The links look like this: :: Code ::
<div id="sbwrap"> <div id="sub_box"> Page: <a href="#" onclick="changeMenu('dinner',1)" id="one">One</a> | <a href="#" onclick="changeMenu('dinner',2)" id="two">Two</a> | <a href="#" onclick="changeMenu('dinner',3)" id="three">Three</a> </div> </div> And the menu looks like this: :: Code ::
<div id="container" class="dinner"> <div id="dintitle"></div> <div id="dincont"> <div id="dc" class="dc1"></div> </div> <div id="bot" class="dp1"></div> </div> For some reason, nothing happens when I click the link. I can't figure out what's wrong with my code and decided maybe you guys could help. I'm a bit rusty with javascript; I haven't used it in a long time. Help! |
|||||
|
All times are GMT - 8 Hours
|
||||||
Contact Us
Hosting: Pair Networks: 0.046
Forum Software © 2001–2009 phpBB
techForum Style © 2003–2009 techpatterns.com
info
Hosting: Pair Networks: 0.046
Forum Software © 2001–2009 phpBB
techForum Style © 2003–2009 techpatterns.com
info