Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Page Reload

Posted on 2003-12-11
3
Medium Priority
?
404 Views
Last Modified: 2010-04-06
I'm not sure where this question is appropriate, hopefully someone here can help.

I'm putting together a site, located at

http://www.jp-creations.net/gft/pages/pft_index.asp?curPage=pft_index&specPage=default

The left menu is currently in an IFRAME, and works in a method that clicking one of the main links reloads the page, checks the querystring, and displays the appropriate sub-links.  Clicking another main menu item (or the same one again) collapses the current menu and opens another.  My question is is there any way I can do this without having to reload the page?  The first version reloaded the entire site, with the new menu open - I managed to contain it in an IFRAME and now only the left side reloads, but if there is any way, I'd still like to remove that slight sequence where it flashes white when the page reloads.

I'd like for the page to remain constant, but have the menu's change when needed.  Is there anyway to accomplish this without using image pre-loads?  (There are too many images to pre-load).  I'd like to accomplish something like can be seen at www.cabair.com

Any help would be appreciated.
0
Comment
Question by:jpve
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 15

Accepted Solution

by:
Timbo87 earned 1000 total points
ID: 9924124
Here is an expand/collapse menu script I wrote:

<html>
<head>
<script language="JavaScript" type="text/javascript">
// Expand/Collapse Menu by Tim Pinkawa

function expand(loc)
{
      if(document.getElementById(loc).style.display=="block")
            document.getElementById(loc).style.display = "none"
      else
            document.getElementById(loc).style.display = "block"
}
</script>
</head>
<body>
<a href="#" onClick="expand('menu1');return false;"><img src="pic1.gif" border=0></a>
<br>
<div id="menu1" style="display:none">
<img src="pic2.gif" border=0>
<br>
<img src="pic3.gif" border=0>
</div>
<a href="#" onClick="expand('menu2');return false;"><img src="pic4.gif" border=0></a>
<br>
<div id="menu2" style="display:none">
<img src="pic5.gif" border=0>
<br>
<img src="pic6.gif" border=0>
</div>
</body>
</html>

Anything between the <div>'s gets displayed when you click the image/button/link. In this example, pic1.gif is the first menu and pic4.gif is the second menu. When you click pic1.gif it displays pic2.gif and pic3.gif. When you click pic4.gif it displays pic5.gif and pic6.gif. This script is Internet Explorer/Netscape/Mozilla compatible.

Hope this helps. If you have any questions or need any more customization please ask.
0
 

Author Comment

by:jpve
ID: 9926715
I have not tested this yet, as I didn't get the chance to check this until late.  I have no doubts that it will work, but will an open menu collapse if I click another main menu item?  For example, if I click pic1, and pic2 and 3 are both shown, if I click pic4 to open the next menu, will the first menu's items, pic2 and 3, collapse automatically?
0
 

Author Comment

by:jpve
ID: 9931034
Your technique works thanks, but is there anyway I can make it so the images don't have to preload?  Is it possible to have them dynamically appear, much the same as the secondary image of an image rollover which isn't set to preload?
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I will show you how to create a ASP.NET Captcha control without using any HTTP HANDELRS or what so ever. you can easily plug it into your web pages. For Example a = 2 + 3 (where 2 and 3 are 2 random numbers) Session("Answer") = 5 then we…
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand. Self-Executing functions are just one good example that I'll try to demystify here.
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

618 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question