PDA

View Full Version : Switch Menu Script - Slow???



gingerDELUCA
05-24-2005, 11:47 PM
http://www.dynamicdrive.com/dynamicindex1/switchmenu.htm

Hi,

I've just added a Switch Menu with persistence "sitewide" to my site http://www.cafepress.com/schnickschnack and it's working but it takes a very long time to load the persistence feature when tested on mac os x.

Is there a way to speed it up? OR Did I do something wrong?
Also is there a way to make the menu fold up completely when people go to the shop home?

Thanks for your help!!!

*gin

jscheuer1
05-25-2005, 05:08 AM
The immediate thing that strikes me as a drag on your page load time is the many levels of nested tables. I forget the exact details but, nested tables slow down a page load, as do large tables that contain virtually all the content of a page. It appears you have a bit of both. More or less what happens is that the browser parses out the table(s) layout and content before it starts filling in the content visually. Using no tables or several small tables not contained within other tables lends for a much faster page load. There could be other things slowing it down but, the table issue is a big one. Just having one large graphic nested somewhere within a table that contains otherwise fast loading content can really slow the load even further. Enough on that for now. Your other question should be easy to resolve. On the page where you want the menu closed set:

persistmenu="no"

you may need to use a separate script for that one page but, including the directive here:
<script type="text/javascript" src="http://www.schnickschnack.biz/e/menu.js" language="JavaScript1.2">
/***********************************************
* Switch Menu script- by Martial B of http://getElementById.com/
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
persistmenu="no"
</script>will probably get it.

gingerDELUCA
05-25-2005, 05:42 AM
Also thanks for pointing out the table issue. I am currently doing a lot of research into how to make websites universally accessible to users of all abilities. That's when the whole table issue pop up also. I was unaware of tables causing such a slowdown but it makes sense.

I am a little overwhelmed however as how to replace all those tables. What are the alternatives?

Also I should explain that my store uses a template and the menu is only inserted into the template and not every single page. The template also has some preset tables that I cannot get rid off. But there are a bunch of avoidable tables that I used in the sections I have access to because I didn't know better.

*gin

PS: Happy Birthday!!!

gingerDELUCA
05-25-2005, 06:11 AM
I got rid off 2 tables! There was one table that held together the two images that make up the blue "bar" at the top and another that held 5 images that form the blue "bar" at the bottom.

Does it still look OK? Is it okay to get rid of tables that hold image maps together when all the images are in the same row?

So instead of:

<td colspan="4"><table width="750" border="0" cellpadding="0" cellspacing="0"><tr><td><a href="http://www.cafepress.com/schnickschnack/535492" title="This Month's Special: Magnetic ABC"><img src="http://schnickschnack.biz/temp/h.png" width="236" height="94" border="0" alt="Magnetic ABC"></a></td><td><a href="http://www.cafepress.com/schnickschnack"><img src="http://schnickschnack.biz/temp/hh.png" width="514" height="94" border="0" alt="Ginger Deluca Purveyor of Fine Schnick Schnack - www.SchnickSchnack.biz - Cool Apparel, Fun Merchandise & Unique Gifts designed by Ginger Deluca"></a></td></tr></table></td>

it becomes:


<td colspan="4"><a href="http://www.cafepress.com/schnickschnack/535492" title="This Month's Special: Magnetic ABC"><img src="http://schnickschnack.biz/temp/h.png" width="236" height="94" border="0" alt="Magnetic ABC"></a><a href="http://www.cafepress.com/schnickschnack"><img src="http://schnickschnack.biz/temp/hh.png" width="514" height="94" border="0" alt="Ginger Deluca Purveyor of Fine Schnick Schnack - www.SchnickSchnack.biz - Cool Apparel, Fun Merchandise & Unique Gifts designed by Ginger Deluca"></a></td>

*gin

jscheuer1
05-25-2005, 07:52 AM
PS: Happy Birthday!!!Thanks!

Well, if it still is the same link, it looks fine and definitely loads faster. Could just be a low traffic period, the load time, as that one change should not make such a big difference but, who knows? Sometimes it can.

gingerDELUCA
05-26-2005, 03:16 AM
I'm taking some more tables out. Please let me know if it ever gets buggy on your system. I can't see! Thanks.

I've tried putting the persistmenu="no" on the front page in the description. It doesn't work because it still uses the script that is defined in the overall template where it says "yes".

Is there a way to trick the template or script into making an exception for the frontpage?

*gin

jscheuer1
05-26-2005, 04:35 AM
We should be able to create, literally, an override variable. At the beginning of the external script insert:

var override=""

then in the onloadfunction:


function onloadfunction(){
if (persistmenu=="yes" && override!=="yes"){
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!="")
document.getElementById(cookievalue).style.display="block"
}
}Then on whatever page you wish to frustrate this behavior, add to the body tag so it has this in it:


<body onload="override='yes'">You could just use persistmenu='no' here and skip the in script modifications but, if you do that, the persistence from this page won't be saved for the other pages to follow.

The SchnickSchnack page still looks fine.

gingerDELUCA
05-26-2005, 05:01 AM
Thanks!

Problem is that the body tag is also part of the template and I cannot change it only on the start page.

Sorry, I should have mentioned that earlier! The only thing I can change on the front page is anything in between the description comments.

*gin

jscheuer1
05-26-2005, 05:22 AM
Well, this is not, I repeat not, to any specification in anyone's book but, you could add a duplicate of the body tag with this command added here:
-->
</style>
<body bgcolor="#ffffff" class="body" onload="override='yes'">
<!-- End Head -->



</head>



<body bgcolor="#ffffff" class="body">I think you can recognize the spot in your code I am referring to. As there is only one body tag allowed per page most, if not all, browsers will accept only the first one. Works here in IE6 and FF 1.0.4 - I even tested it with the bgcolor. The first body tag overrides the content of the second, both for the onload event and background color. If need be to fool other browsers, you could insert a duplicate </head> tag before the added first body tag, FF and IE like it either way.

gingerDELUCA
05-26-2005, 05:29 AM
Again many thanks!

I've tried to put it between the desription comment
<!-- D --> but it didn't really do the trick.

I can't put it in the head comment that's also template! Sorry -- it's a real pain with this template but there is no way for me to dump it.

*gin

jscheuer1
05-26-2005, 05:49 AM
Well, how did you get your script in there? You could even do it like this:


<script type="text/javascript" src="http://www.schnickschnack.biz/e/menu.js" language="JavaScript1.2">
/***********************************************
* Switch Menu script- by Martial B of http://getElementById.com/
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
</script><noscript>Sorry! Your browser does not support JavaScript.</noscript>
<body bgcolor="#ffffff" class="body" onload="override='yes'">Given the way the page looks when I check its code. This would only put it before the style section. This may or may not affect the effectiveness of the declaration:

.body{
margin-top:0px;
margin-right:0px;
margin-bottom:0px;
margin-left:0px;
width: 750px;
}

If it does, just add your own declaration inside the tag:
<body bgcolor="#ffffff" class="body" onload="override='yes'" style="margin:0;width:750px">This is equivalent to the current declaration.

gingerDELUCA
05-26-2005, 06:08 AM
It's all kind of tricky. I'm using a template with the script sitting in the template. So the script shows up on every page just like the header, footer and sidebar without me ever writing html for any of these pages.

The only thing I can change on the start page is between the D comment. If I change anything between the head-/H- or F-comment it will affect the entire web site. Anything else in the html I don't have access to.

Let me kow when this drives you crazy. I know it's quite a challenge but I really appreciate your input! Thanks!

*gin

jscheuer1
05-26-2005, 06:51 AM
If you cannot individualize the head area or the body tag on a page, it is tough. You can insert the call for the script at the top of this 'D' area on each individual page. Then on the page you don't want it to persist, call a slightly different version, one with this part removed:
if (window.addEventListener)
window.addEventListener("load", onloadfunction, false)
else if (window.attachEvent)
window.attachEvent("onload", onloadfunction)
else if (document.getElementById)
window.onload=onloadfunctionThat should get it. I tested this all out here locally. It might happen that live, the script could fail to load before the body but, that should only affect the persist feature that one page load for that page on the pages using that feature. Since you are using an external script it will get cached, making it load faster subsequently. If this doesn't work for some reason, you will have to put the actual script on each page. I doubt it will come to that.

gingerDELUCA
05-26-2005, 07:17 AM
Now, the puzzle is even one step more complicated -- a real brain teaser. There's only a d section on the start page. Most pages I never touch and couldn't if I wanted to -- they are generated automatically using the template.

The only thing I was thinking: Is there
...a way to specify the persistance no for a specific page, e.g. the start page within the script? OR
...some little trick that could be inserted in the d section on the start page?

I guess those are my only options.

*gin

jscheuer1
05-26-2005, 07:45 AM
By George (apologies to George) I think you've got it. Try modifying the script like so:


function onloadfunction(){
if (persistmenu=="yes" && location.href!=='nameofpage'){
var cookiename=(persisttype=="sitewide")? "switchmenu" : window.location.pathname
var cookievalue=get_cookie(cookiename)
if (cookievalue!="")
document.getElementById(cookievalue).style.display="block"
}
}To find the exact name of the page in this context, temporarily put this in its D section:
<script type="text/javascript">
alert(location.href)
</script>Use the exact name as shown in the alert box this will produce in place of the red section above.

gingerDELUCA
05-26-2005, 06:31 PM
Sorry, I don't quite get what name I'm supposed to put. Are the xxx supposed to be identical?


if (persistmenu=="yes" && location.href!=='xxx'){


<script type="text/javascript">xxx(location.href) </script>

*gin

jscheuer1
05-27-2005, 03:24 AM
I obviously didn't get through to you. The idea is we are going to screen out the main page. To do this we need to know the exact value it returns as its:

location.href

To find that value we create a temporary script to put in the main page's 'D' section. Here is that script, verbatim:

<script type="text/javascript">
alert(location.href)
</script>

When the above script runs on your main page it will produce an alert box with the exact name of the page and an OK button on it. Copy exactly the name as it is shown into the modification for the switch menu script replacing the red nameofpage with it. You do see the red color, I hope? Once we have that name, we remove the temporary script from the page.

gingerDELUCA
05-27-2005, 03:40 AM
Thanks for making it clearer. I had no clue what you were talking about the first time around. I'll give it a shot.

*gin

gingerDELUCA
05-27-2005, 03:52 AM
I put the name that came up -- the same name that is visible in the URL field -- that's why I didn't get the alert script thing -- into the menu script und voila it's working!!!

Thanks for this excellent script addition!!! Awesome!!! :)

*gin

jscheuer1
05-27-2005, 04:05 AM
Well, really it was your idea. The only reasons I wanted to do the alert box thing were:

1) You can use two different URL's to reach the page.

2) The page filename itself doesn't show in the location bar.

Otherwise, I would have just suggested what the alert box test yielded to begin with. Just being sure.

gingerDELUCA
05-27-2005, 06:58 AM
See, I have no clue about the script codes. That's why I'm so thankful for the help of someone who gets what's going on in the code!

When I put the alert thing I didn't get that it was for temporary testing only - to find out the name and be sure etc. That wasn't clear to me. And I was surprised when it only showed an alert with the url I happened to know. I thought it's part of the trick and you marked the page with a name that had to be the same in the script that's why the xxx question.

I get it now though you wanted to be safe because you can get there using http://www.SchnickSchnack.biz (that's just a page with a redirect) or http://www.cafepress.com/schnickschnack. I hadn't even though of that. Good eye!

Everything concerning scripts is pretty mysterious to me! I just put them on my page and hope they'll work and maybe make some little adjustments if I can find somebody who can tell me how.

So thanks for being patient when I ask questions that seem odd or silly!

*gin

jscheuer1
05-27-2005, 08:27 AM
It wasn't so much that your question seemed odd or silly, more like confusing. I have to admit to a bit of panic trying to figure out how to make things clearer. I was having a hard time understanding what the various x's were supposed to stand for. However, as I said, it was your idea, and I might add, arrived at through logical deduction and, apparently a very good one! I'm just glad we could make it work without too much trouble. I remember going on for at least a week with this one Turkish fellow who just could not grasp what a frameset was even though his entire site was based on one. We finally got it settled and his site looks great.

cedricv
08-24-2005, 01:56 PM
Hello, that's a trick :

I m looking for help to add the persistence feature to the Tab menu II (http://www.dynamicdrive.com/dynamicindex1/ddtabmenu2.htm) ...:confused:

Any help is welcome !!! ;)
Thanks very much :)

cedricv
08-24-2005, 01:58 PM
Hello, that's a trick :

I m looking for help to add the persistence feature to the Tab menu II (http://www.dynamicdrive.com/dynamicindex1/ddtabmenu2.htm) ...:confused:

Any help is welcome !!! ;)
Thanks very much :)

jscheuer1
08-24-2005, 02:17 PM
cedricv,

Please stop tacking your question on to old threads that do not directly relate to it. Start a new thread and state your question clearly, following the posting guidelines:
whatever
and:
.