473,406 Members | 2,954 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,406 software developers and data experts.

Making alternative menu if javascript is turned off?

Hi,

I have found some menu functions. It works quite well, but how can I
replace it with a simple <a href> if javascript is turned off?

I reduced my code to:
<script>IncludeMenuHere()</script>

More, any tips about "fading" the menu item in and out (x-browser)?
Currently it's using DIVs and this.items[i].visibility(false);

--
-Gernot

Post here, don't email. If you feel you have to mail, revert my
forename from:
to******************************@invalid.com
________________________________________
Looking for a good game? Do it yourself!
GLBasic - you can do
www.GLBasic.com
Jul 23 '05 #1
10 2091
Gernot Frisch wrote:
I have found some menu functions. It works quite well, but how can I
replace it with a simple <a href> if javascript is turned off?

I reduced my code to:
<script>IncludeMenuHere()</script>


<script>IncludeMenuHere()</script>
<noscript><a href="http://www.example.com/menu/">Menu</a></noscript>

--
Klaus Johannes Rusch
Kl********@atmedia.net
http://www.atmedia.net/KlausRusch/
Jul 23 '05 #2
Klaus Johannes Rusch wrote:
I have found some menu functions. It works quite well, but how can I
replace it with a simple <a href> if javascript is turned off?

I reduced my code to:
<script>IncludeMenuHere()</script>


<script>IncludeMenuHere()</script>
<noscript><a href="http://www.example.com/menu/">Menu</a></noscript>


Script - Noscript is unlikely to be the true relationship between a
functional DHTML menu and no navigation. True, the browsers that will
not execute scripts at all will use the noscript element, but there is a
big grey aria of javascript capable browsers that are more or less
dynamic and may or may not facilitate the actions required by the
script. Leaving any that don't support the menu but are executing
scripts without any navigation.

Various strategies may be applied to the problem, of which the simplest
is probably just to provide a link to a site map in the HTML and leave
it there regardless of whether the menu works. But a functional dynamic
DHTML menu implies the ability to manipulate HTML page contents so it
would be possible for a menu that has verified that it is supported and
functional to conceal/remove alternative navigation.

Overall, probably the most viable strategy is to have the navigation
menus defined on the page as, say, nested UL lists, and have the menu
script modify those elements into a dynamic menu when possible. Leaving
all browsers that lack support for the menu showing full navigation as
part of the page contents.

Richard.
Jul 23 '05 #3
> Overall, probably the most viable strategy is to have the navigation
menus defined on the page as, say, nested UL lists, and have the menu script modify those elements into a dynamic menu when possible. Leaving all browsers that lack support for the menu showing full navigation as part of the page contents.


That sounds nice, but I don't absolutely know how to do this. It's an
sophisitcated topic, is it?
Here's my menu so far:
http://GLBasic.com

-Gernot
Jul 23 '05 #4
That sounds nice, but I don't absolutely know how to do this. It's an
sophisitcated topic, is it?
Here's my menu so far:
http://GLBasic.com

-Gernot


This might not be what your looking for... but it might help ;) just some
DOM 1 stuff ;) The document elements have alot of properties you can change,
so do some googling ^.^

<script language=javascript>
function makeMyMenuStringFormMenu(menuNum) {
if (menuNum == 1) {
return '<a href="Not Blah Anymore">Not Blah Anymore</a>';
}
}

function loadMenus() {
// Make menu items color grey
document.getElementById('menuItem1').style.color = '#E0E0E0'
// Make background black
document.getElementById('menuItem1').style.backgro undcolor = '#000000'
// Change the actual HTML inbetween the <a id="name"> ... </a>
document.getElementById('menuItem1').innerHTML =
makeMyMenuStringFormMenu(1);
}
</script>

....
....
<body onLoad="loadMenus();">
....
....

<a id="menuItem1"><!--This is basic, html, without jscript version --><a
href="Blah">Blah</a></a>
Jul 23 '05 #5
document.getElementById('menuItem1').innerHTML =
makeMyMenuStringFormMenu(1);

Ahhh.. Now, <TABLE ID="MyTable"> ...here go the links...</TABLE>

<SCRIPT>document.getElementById('MyTable').innerHT ML =
MakeMyMenuReplaceTheOldTable();</SCRIPT>

will work??
Have to try that. Very cool!

BTW. JavaScript looks more and more attractive to me. Is there any
Intelli-sense IDE for it? Or at least an reference where I can read
about all methods and properties available for all object types?

--
-Gernot

Post here, don't email. If you feel you have to mail, revert my
forename from:
to******************************@invalid.com
________________________________________
Looking for a good game? Do it yourself!
GLBasic - you can do
www.GLBasic.com
Jul 23 '05 #6
I just google stuff... but most things in javascript work of two things, A)
DOM and B) Java objects. So if you have:

var myStr = "some string";

or

var myStr = String("some string");

it same thing... but the cool thing is both are "String Objects" so straight
our of the Java API (and not javascript) someone could...

myStr.substring(start, end);

and DOM is a W3C standard, DOM 0 was Netscape, but the new DOM 1 is
standard, so read up on DOM (the id="something" stuff, and the
document.domThingy (stuff under the document variable (or, at least
functionally, object) is all DOM as far as i know)... But i'm new to
jscript... only been playing with it about a week or so... I'd say read the
base object types (ie string, char, boolean, integer) in the java API to get
a feel for what your variables can do... and read up on DOM...

"Gernot Frisch" <Me@Privacy.net> wrote in message
news:c6************@ID-37212.news.uni-berlin.de...
document.getElementById('menuItem1').innerHTML =
makeMyMenuStringFormMenu(1);

Ahhh.. Now, <TABLE ID="MyTable"> ...here go the links...</TABLE>

<SCRIPT>document.getElementById('MyTable').innerHT ML =
MakeMyMenuReplaceTheOldTable();</SCRIPT>

will work??
Have to try that. Very cool!

BTW. JavaScript looks more and more attractive to me. Is there any
Intelli-sense IDE for it? Or at least an reference where I can read
about all methods and properties available for all object types?

--
-Gernot

Post here, don't email. If you feel you have to mail, revert my
forename from:
to******************************@invalid.com
________________________________________
Looking for a good game? Do it yourself!
GLBasic - you can do
www.GLBasic.com

Jul 23 '05 #7
On Wed, 21 Apr 2004 10:48:44 +0200, Gernot Frisch <Me@Privacy.net> wrote:
document.getElementById('menuItem1').innerHTML =
makeMyMenuStringFormMenu(1);

Ahhh.. Now, <TABLE ID="MyTable"> ...here go the links...</TABLE>

<SCRIPT>document.getElementById('MyTable').innerHT ML =
MakeMyMenuReplaceTheOldTable();</SCRIPT>

will work??
Have to try that. Very cool!


I can't say I like that approach. I imagine that it will still provide
poor support for some browsers. Richard's suggestion of a list modified by
CSS and scripting is the best. Though many people implement menus along
this line, the only one that I've found to be well implemented to date is
this one:

<URL:http://www.gazingus.org/html/Using_Lists_for_DHTML_Menus.html>

It is a little different in that you must click on the items to open the
menu (just like an application menu bar), but at least this means that the
menu won't disappear whilst you're trying to make a selection.

Be aware that this style of menu will mean you must provide valid pages
for the first level of links, as well as for the sub-menus. However, this
will have been a consideration with any well implemented menu.
BTW. JavaScript looks more and more attractive to me. Is there any
Intelli-sense IDE for it?
Unfortunately, it's not practical (though some vendors have implemented
them anyway). There isn't really any guaranteed set of properties and
methods that are supported by all browsers, especially with regard to
newer technologies. You could list every single known member for an
object, but that wouldn't be very helpful to the developer.
Or at least an reference where I can read about all methods and
properties available for all object types?


The group's FAQ contains some:

<URL:http://jibbering.com/faq/>

A shorter list would contain (watch for wrap)

Netscape's JavaScript references:
<URL:http://devedge.netscape.com/central/javascript/>

Note that the more recent version strip out the older host objects
(document, window, location, history, etc). I presume that this is because
they wish to focus around the World Wide Web Consortium (W3C) Document
Object Model (DOM). However, the host objects are still implemented in
browsers, and are described in v1.3 of the references.

Microsoft's DHTML reference:
<URL:http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtml_reference_entry.asp>

A lot of the features described are implemented only by IE, so you should
be careful what you use. The documentation is also incorrect in places.

W3C DOM technical reports:
<URL:http://www.w3.org/DOM/DOMTR>

The Level 1 specifications are fairly well supported by recent browsers,
and the more compliant browsers (Mozilla and Opera) do well with Level 2.
Level 3 has only recently reached Recommendation status, so support will
be poor.

ECMAScript specification:
<URL:http://www.ecma-international.org/publications/standards/Ecma-262.htm>

This particular piece of documentation can be very difficult to
understand, but it does specify exactly what JavaScript should support, as
well as it's syntax and features. The Netscape references give a much more
understandable, though simplified, description of most of the contents.

I'd recommend that you also read the group FAQ (link already given above),
particularly item 4.26 - How do I detect Opera/Netscape/IE? That article
contains links on how to perform feature detection - vital when using
objects that aren't always supported.

Good luck,
Mike

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 23 '05 #8
To get things right:

I don't want to support browsers older than the IE4.x, I only want my
menu to be displayed, if someone disables Javascript - will the
<noscript> work then??
-Gernot
Jul 23 '05 #9
On Wed, 21 Apr 2004 11:14:00 GMT, Robert Diamond <-r***@anti.spam.com>
wrote:
I just google stuff... but most things in javascript work of two things,
A) DOM and B) Java objects. So if you have:

var myStr = "some string";

or

var myStr = String("some string");

it same thing...
Though the latter isn't very practical. You only need to use the String()
constructor as a function when you want to convert another type to a
string. For example,

var myStr = String( 7 );

will produce "7", as will

var myStr = '' + 7;

The conversion in the latter example is performed automatically.
but the cool thing is both are "String Objects"
Actually, they are both string values. However, you can still use String
object methods and properties. For example,

var myStr = "some string";
myStr.charAt( 6 ) // 't'
'7'.length // 1

To create a String object, you would use "new String(...)". However, I
don't think there's much need for you to ever do that.
so straight our of the Java API (and not javascript) someone could...
I don't see what the Java API has to do with it...
myStr.substring(start, end);
....but you can certainly do that in JavaScript.
and DOM is a W3C standard, DOM 0 was Netscape,
I believe that "DOM 0" refers to a combination of Netscape's and
Microsoft's object models during the time before DOM 1.
but the new DOM 1 is standard, so read up on DOM (the id="something"
stuff, and the document.domThingy (stuff under the document variable
(or, at least functionally, object) is all DOM as far as i know)... But
i'm new to jscript... only been playing with it about a week or so...
I'd say read the base object types (ie string, char, boolean, integer)
in the java API to get a feel for what your variables can do... and read
up on DOM...


I'd suggest reading Netscape's JavaScript Guide would be a better
start[1]. Links are in my other post.

[snip]

Mike
Please don't top-post.

[1] Skip v1.3. Though that version of the reference is good for host
objects, the guide contains information that is obsolete and should be
avoided, particularly with regard to including scripts in HTML.

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 23 '05 #10
On Wed, 21 Apr 2004 14:43:05 +0200, Gernot Frisch <Me@Privacy.net> wrote:
To get things right:

I don't want to support browsers older than the IE4.x, I only want my
menu to be displayed, if someone disables Javascript - will the
<noscript> work then??


Mark-up present in NOSCRIPT elements will be parsed when JavaScript is
disabled, but it probably won't be of much use. The advantage of menus
that use plain HTML and CSS, and are manipulated with scripts will allow
seemless degradation if JavaScript, or even CSS, is unavailable. They
won't function in the same way certainly[1], but they are still usable and
that is the goal.

I do recommend that you follow the example that was set in the first link
I gave you. It is a good implementation.

Mike
[1] Menu systems can be produced so that they will work normally with only
CSS support, but IE can't handle them.

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 23 '05 #11

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

5
by: relaxedrob | last post by:
Howdy All! I have just finished developing a menu template for easy use in an any web page! The example uses CSS and JavaScript. The url is:...
5
by: Papa.Legba.666 | last post by:
I am a total lamer clueless stupid newbie (so please flame me). Honestly, I know nothing of CSS, although I tend to pick things up quickly... A friend pointed out that my JavaScript menu...
2
by: Simon Wigzell | last post by:
Is it possible within javascript to stop the little pulldown menu (with the values that the browser remembers have previously been entered into the field) from appearing? I have one very dense form...
7
by: johkar | last post by:
I am confused on childNodes or children. When you have nested lists, I would think it would all be one list in the Dom, this doesn't seem to be the case. So how do you traverse an unordered list?...
18
by: Andromeda | last post by:
I've been trying to add a tree menu to my website with some luck (more or less). I came across a script on simplythebest.net, but I seem to be having a problem with it... and since they have no...
7
by: Privacy Advocate | last post by:
//crossposted to: comp.lang.javascript, alt.comp.lang.javascript in an effort to get factual answers from JavaScript experts// Simply put; Is it possible to obtain the real (actual) IP address of...
21
by: abctech | last post by:
Hi all, I am working on a web application using JSP and Javascript. I have attached a snapshot of my form here, I have 2 different Jsps here, viz Jsp1 and Jsp2. On hitting the 'Show' button...
1
by: HACKhalo2 | last post by:
Hi. I'm helping a friend of mine develop an online game, which is currently outdated. The person making skins for the site came up with a cool looking NavBar (found at...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.