Member Avatar for rameshreddy

cursor move on to "menu" then i get submenu in submenu i click on one option the page will display on <div> of same page, plz help me.thanks in advance.
my code is:

<a href="#" onmouseover="javascript:test(1)" id="ss">tutor</a>
<div id="frame1"  style="position:absolute; top:120px;left:65px;" class="hide";>
<table id="itut" border="1">
<tr>
<td>
<a href="#" onclick="tutorlogin()">tutorlogin</a><br />
</td></tr><tr>
<td>
<a href="#" onclick="tutordirectory()">tutordirectory</a><br />
</td></tr>
<tr>
<td>
<a  href="#" onclick="tutorforum()">turorforum</a></td></tr></table>
</div>
<style type="text/css" media="screen">
        .show {
            display:block;
            }
        .hide{
            display:none;
        }
        .
        </style>
<script language="javascript">

function test(n)
{
    for( var i=1;i<3;i++)
    {
     document.getElementById("frame"+i).className='hide';
    if(n==i)

       document.getElementById("frame"+i).className='show';
      else
      document.getElementById("frame"+i).className='hide';
      }
      return true;

}

if i click on tutorlogin the tutorlogin.php(another page call through function) wil ldispay

Edited by mike_2000_17 because: Fixed formatting
  • 3 Contributors
  • 2 Replies
  • 115 Views
  • 8 Hours Discussion Span
  • Latest Post Latest Post by BzzBee

Dani AI

Generated

A short, practical suggestion for based on the replies from and : avoid frames (they break navigation and are outdated) and follow ’s direction by loading submenu pages into a central content container with a modern AJAX approach. Use CSS for the hover submenu, attach event handlers with JavaScript (not inline attributes), and toggle visibility with classList so you do not wipe out other classes.

A minimal, robust pattern: give each submenu link a data-url pointing to the PHP endpoint that returns an HTML fragment. Use delegated click handling on the menu, fetch() to get the fragment, then insert it into a #content div. Example:

document.querySelector('#menu').addEventListener('click', function(e) {
  const a = e.target.closest('a[data-url]');
  if (!a) return;
  e.preventDefault();
  fetch(a.dataset.url)
    .then(res => { if (!res.ok) throw new Error(res.status); return res.text(); })
    .then(html => document.querySelector('#content').innerHTML = html)
    .catch(err => console.error('Load failed:', err));
});

Troubleshooting and cautions: ensure your PHP returns only the fragment you want to insert (or return JSON and render it), watch the browser console for CORS or 404 errors, use classList.add()/remove() instead of assigning className, and use mouseenter/mouseleave or pure CSS :hover to avoid flicker. Add history.pushState() if you need back/forward support. References: Fetch API (Using Fetch) (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) and Element.classList (https://developer.mozilla.org/en-US/docs/Web/API/Element/classList).

Recommended Answers

All 2 Replies

Member Avatar for mahendrabilla

Use Frames Instead of DIV

Solutions:
On the same page, lets assume you have the two frames.

First Frame: Display the Menus

Second Frame: Display the page you require.

Thanks,
Mahendra Vishwanath Billa
---------------------------------------------------------------
Please mark the thread as Solved if satifies your requirements.

Member Avatar for BzzBee

you can try ajax.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.