Ok, fix 2 things uncover 2 more that don't work.
I have a row of big buttons (with images) on the main page. Clicking on any of these buttons, works correctly. Then click home button (from either horizontal or vertical menus). After clicking on the home button, the big buttons no longer respond to the mouse click. Why is jquery disconnecting from these big buttons on supplemental clicks??
online sample of whole site is
here.Big Button code:
- <div id='bigButtons'>
- <div class='image' id='classroom'>
- <a href='#'><img src='media/Classroom.png' title='Classroom Training' alt='Classroom Training' /></a>
- <p class='caption'>Classroom Training</p>
- </div>
- <div class='image' id='dlTrng'>
- <a href='#'><img src='media/Virtual.png' title='Online Training' alt='Online Training' /></a>
- <p class='caption'>Online Training</p>
- </div>
- <div class='image' id='crseCat'>
- <a href='#'><img src='media/Catalog.png' title='Course Catalog' alt='Course Catalog' /></a>
- <p class='caption'>Course Catalog</p>
- </div>
- .......
- </div>
And here is the code that is controlling the those big buttons:
- $('#bigButtons div').on("click", function(event) {
- var itemVar = $(this).attr('id');
- event.preventDefault();
- /*$('#content').empty();*/
- switch(itemVar) {
- /*case 'classroom' : alert('you clicked' + $(this).attr('id')); break;*/
- case 'classroom' : $('#content').load('classroom.html'); break;
- case 'dlTrng' : $('#content').load('online.html'); break;
- case 'crseCat' : $('#content').load('crseCat.html'); break;
- case 'internTrng' : $('#content').load('onboard.html'); break;
- case 'navyTrng' : $('#content').load('navyTraining.html'); break;
- case 'siteFAQ' : $('#content').load('siteFAQ.html'); break;
- };
- });
So where am I loosing my jquery script??
Tony
It is not the job you get handed, but what you have done with it in the end that people remember.