Javascript disabled

MikeB · Post by **MikeB** » Fri Mar 02, 2007 6:56 pm

If someone has Javascript disabled, what will they see in place of the menu?

Post by **Ruth** » Fri Mar 02, 2007 7:08 pm

Hi Mike,

They will see whatever you have placed there as a 'menu'

Many people set up links in noscript tags for that option, others use the
listbased menu so if the js is off then the list shows up. You can find the
listbased menu in the menu download. Open the extras folder once you
unzip it and you'll see a folder 'listbased'.

Ruth

borderfox · Post by **borderfox** » Wed Apr 25, 2007 1:12 pm

I have successfully installed the regular menu. Having read the above, I
have a copy of listmenus.js from the 'extras' folder. What is the procedure
for setting this up as an alternative when javascript is disabed?

borderfox · Post by **borderfox** » Wed Apr 25, 2007 7:33 pm

Can anyone point me in the right direction as i'm starring at that module
(listmenus.js) and i really am not sure what the hell to do with it.

Post by **Ruth** » Wed Apr 25, 2007 11:43 pm

Hi,

If you got the listmenu.js from the extras folder, there is also an index
page. Open that page and look at the source. You'll see how the lists were
set up and then how the milonic files were called and where the style was
created and where the listmenu.js is called.

I would be glad to help but I'll need your page and existing menu so I
know where you have it and what is in it to explain based on your setup
how to do the listmenu

Ruth

borderfox · Post by **borderfox** » Wed Apr 25, 2007 11:46 pm

Thanks Ruth...appreciate you coming back. Will check that out tomorrow
when i'm working on the site again.

borderfox · Post by **borderfox** » Thu Apr 26, 2007 8:29 pm

[quote=Ruth]I would be glad to help but I'll need your page and existing
menu so I know where you have it and what is in it to explain based on
your setup how to do the listmenu Ruth[/quote]

Test page is here => http://www.energysurveyor.net/index_a.html

Your comments on how to implement would be appreciated.

Post by **Ruth** » Fri Apr 27, 2007 8:13 am

Hi,

OK, to do the list menu you would put your main menu and submenu items
into that left div as lists, then below that you would put the style and the
call to buildListMenu. So, if a main menu item doesn't have a submenu
then it is coded as follows [the ul id=miloincmenu1 is the id of the list which
allows the menu to read it and make a regular menu out of it]

Code: Select all

<ul ID=milonicmenu1>
<li><a href="http://websites.milonic.com/energysurveyor.net/>Home</a></li>
<li><a href="http://websites.milonic.com/energysurveyor.net/about_us_a.html>
About Us</a></li>

Then if an item has a submenu it is coded like this, no closing /li for the
line until after the inserted ul for the submenu and the closing ul for that
submenu, like this

Code: Select all

<li><a href=#>Services</a>
	<ul>
		<li><a href="http://websites.milonic.com/energysurveyor.net/ber_a.html>Building Energy 
Rating</a></li>
		<li><a href="http://websites.milonic.com/energysurveyor.net/blower_door_test.html>Building 
Airtightness Testing</a></li>
		<li><a 
href="http://websites.milonic.com/energysurveyor.net/building_thermography.html>Building
Thermography</a></li>
		
	</ul>
	</li>

Then back to the same as the first items that didn't have submenus.

You're existing page as you have it set up would be

Code: Select all

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 
Transitional//EN">
<HTML 
xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Energy Rating 
Ireland</TITLE>

<head>
<title>Milonic DHTML/JavaScript Menu Sample Page</title>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<LINK 
href="main.css" type=text/css rel=stylesheet>

<STYLE type=text/css>.style1 {
	FONT-SIZE: 18px
}
.style2 {
	FONT-SIZE: 36px
}
.style3 {
	FONT-SIZE: 9px
}
</STYLE>

<META content="MSHTML 5.50.4807.2300" name=GENERATOR></HEAD>

<body>
<script type="text/javascript" src="milonic_src.js"></script>
<script type="text/javascript" src="mmenudom.js"></script>
<script type="text/javascript" src="listmenus.js"></script>

<!-- Begin Wrapper -->
<DIV id=wrapper><!-- Begin Header -->
<DIV id=header>
<P class=style2><IMG height=100 alt="Building Energy Rating Ireland" 
src="header.gif" width=900></P></DIV><!-- End Header --><!-- Begin 
Left Column -->
<DIV id=leftcolumn>
<ul ID=milonicmenu1>
	<li><a href="http://websites.milonic.com/energysurveyor.net/>Home</a></li>
	<li><a href="http://websites.milonic.com/energysurveyor.net/about_us_a.html>About Us</a></li>
	<li><a href=#>Services</a>
	<ul>
		<li><a href="http://websites.milonic.com/energysurveyor.net/ber_a.html>Building Energy Rating</a></li>
		<li><a href="http://websites.milonic.com/energysurveyor.net/blower_door_test.html>
Building Airtightness Testing</a></li>
		<li><a href="http://websites.milonic.com/energysurveyor.net/building_thermography.html>Building Thermography</a></li>
		
	</ul>
	</li>
	<li><a href="http://websites.milonic.com/energysurveyor.net/contact_us_a.html>Contact Us</a></li>
	<li><a href="http://websites.milonic.com/energysurveyor.net/links_a.html>Links</a></li>
	
	<li><a href="http://websites.milonic.com/energysurveyor.net/news_a.html>News</a></li>
</ul>




<script>
_menuCloseDelay=500;
_menuOpenDelay=150;
_subOffsetTop=2;
_subOffsetLeft=-2;

with(menuStyle=new mm_style()){
bordercolor="#999999";
borderstyle="solid";
borderwidth=1;
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
offbgcolor="#eeeeee";
offcolor="#000000";
onbgcolor="#420000";
oncolor="#ffffff";
itemwidth="195";
menuwidth="195";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow
(color=#777777', Direction=135, Strength=3)";
padding=4;
pagebgcolor="#82B6D7";
pagecolor="black";
separatorcolor="#999999";
separatorsize=1;
subimage="../../arrow.gif";
subimagepadding=2;
}


// syntax: buildListMenu("id of list", "menu style name", "main menu 
properties")

buildListMenu
("milonicmenu1","menuStyle","alwaysvisible=true;orientation='vertical';
position='relative';")
buildListMenu
("milonicmenu2","menuStyle2","alwaysvisible=true;orientation='vertical';
top=300;left=310;")
buildListMenu("milonicpopupmenu","menuStyle","")

</script>

</DIV>
<!-- End Left Column --><!-- Begin Content Column -->
<DIV id=content><A 
href="http://websites.milonic.com/energysurveyor.net/index_a.html#"></A>
<P class=style3 align=center>|<A 
href="http://websites.milonic.com/energysurveyor.net/index_a.html"> Home</A> | 
Building Energy 
Rating | About Us | Links | Contact Us | </P>
<H1 class=style1> </H1>
<H1 class=style1>Building Energy Rating </H1>
<P class=style1> </P>
<P class=style4>Energy Survey Services has been established to provide 
a 
specialist Energy Rating Service to all builders & developers of new 
housing 
in the West of Ireland. From 1st January 2007 onwards, Part L of the 
Building 
Regulations requires that every new dwelling is offered to the potential 
homebuyer with a Building Energy Rating (BER) Certificate.<BR>Energy 
Survey 
Services can assist you by way of the following;</P>
<P class=style4> </P>
<UL class=style4>
  <UL>
    <UL>
      <UL>
        <UL>
          <UL>
            <UL>
              <UL>
                <LI>Provide you with a Preliminary (plan based) Rating at design 
                stage. </LI></UL></UL></UL></UL></UL></UL></UL>
  <LI>Offer advice on how the rating could be improved upon. 
  <LI>Feedback on how the use of alternative systems you may be 
considering will 
  impact on the rating. 
  <LI>Rapid turnaround from your initial contact with us to actual receipt of 
  the Rating Certificate. </LI></UL>
<P class=style4>In a slowing market, achieving a superior Energy Rating now will 
give your current development a unique selling point - and contribute 
towards 
maintaining your margins.</P></DIV>
<DIV align=left><!-- End Content Column --><!-- Begin Right Column --></DIV>
<DIV id=rightcolumn>
<P><IMG height=70 alt="energy rating galway" 
src="BER_Rating.png" width=45> </P>
<P> </P>
<P><IMG height=70 alt="Building Energy Rating Galway Sligo Roscommon 
Mayo" 
src="BER_Certificate.png" width=45></P>
<P> </P>
<P><IMG height=70 alt="Blower Door Testing" src="energy.png" 
width=45></P>
<P> </P>
<P><IMG height=70 alt="BER Certificate" src="low_carbon.png" 
width=45></P></DIV><!-- End Right Column -->
<!-- Begin Footer -->
<DIV id=footer>
<DIV align=center>Energy Survey Services - Based in the West of 
Ireland - 
Serving Mayo, Galway, Sligo, Leitrim, Roscommon 
</DIV></DIV><!-- End Footer --></DIV><!-- End Wrapper -->
</body>
</html>

Of course the urls for the images aren't correct since I donwloaded
everything to one folder. Hope this helps

Ruth

borderfox · Post by **borderfox** » Tue May 01, 2007 3:05 pm

@Ruth: am I right in thinking that the menu is now Search Engine Friendly
now also - due to the lists?

Post by **Ruth** » Tue May 01, 2007 4:50 pm

Hi,

Actually, it is the list that is search engine friendly and the menu just takes the list to build itself

borderfox · Post by **borderfox** » Wed May 02, 2007 10:17 pm

@Ruth: I'm afraid I not quite out of the woods yet! If you can solve this
one last query, I promise never to bother you again

I have rebuilt the page http://www.energysurveyor.net/index_c.html
here and put it through a validator and it passes the test for xhtml 1.0
strict.

It displays fine in Firefox. It displays fine in IE with Active X disabled.
However, in IE with Active X switched on - the page is rendered with
the 'right column' pushed below the rest of the page.

Do you know why this happens? What can I do to fix it?

Post by **Ruth** » Wed May 02, 2007 11:26 pm

Hi,

Well, I don't know what Active X has to do with it unless something is set as default to do with transitions or something. However, the fix is to change your content div width to 450 instead of 456. Especially since the width of your wrapper is 922 but the total of the padding, margins, borders and widths for those 3 columns is, I think if I added right, 927. Try that and see if it works. Of course, that doesn't answer why it works without active x on, unless it's something to do with what that does to the browser, maybe margin rendering or something. I have not a clue

Ruth

peng · Post by **peng** » Mon May 07, 2007 3:39 pm

I've just realised that search engines don't follow Javacript and only my index page is indexed on Google etc! Could someone (maybe Ruth

?) advise on the merits of constructing/using either a alternative table and/or list based menu or an alternative menu using the noscript tag.

This must be such a common problem, I would have thought that Milonic could or should develop model alternative search engine friendly menus with sample HTML coding etc.

Post by **Ruth** » Mon May 07, 2007 6:57 pm

Hi,

If you are using the listmenu, then it should read those list items on every page, unless you're only putting the listmenu on the main index page. It's why I gave you the listmenu setup. Or you can do what Milonic does. It has a div set as id=nsmenu class=nsmenu with a table in it with list links and then this js call after it

Code: Select all

<script type="text/javascript">
	// Displays the above menu if JS is off as this bit will not execute
	gmobj("nsmenu").style.display="none";
</script>

This code means if js is on, that code executes and hids this div, but if it's off then the browser can execute this and the div shows up. Take a look at the source of the Milonic home page to see how it's done.

http://milonic.com/

Ruth

Milonic JavaScript Menu

Javascript disabled

Javascript disabled

setting up a list based menu