473,241 Members | 1,761 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,241 software developers and data experts.

How to create expanding menu and submenu using images not text

I need some help.

I have javasript that creates the submenu but it works if I have a text with css. I need it to do the same with a roll over images. so when I click on the image the submenu (images) shows with roll overs as well.

That's what I have...
[HTML]<script type="text/JavaScript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

<body onload="MM_preloadImages('images/home_mo.jpg','images/aboutus_mo.jpg','images/contactus_mo.jpg','images/icmember_mo.jpg','images/joinnow_mo.jpg','images/invite_mo.jpg','images/icspomsorship_mo.jpg','images/iccalender_mo.jpg','images/member_mo.jpg','images/intelligent_mo.jpg','images/intelligent_comm_mo.jpg','images/intelligent_community_mo.jpg','images/myprofile_mo.jpg')">

and this for the images
<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images/home_mo.jpg',1)"><img src="images/home.jpg" name="Image2" width="104" height="28" border="0" id="Image2" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images/aboutus_mo.jpg',1)"><img src="images/aboutus.jpg" name="Image3" width="98" height="28" border="0" id="Image3" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','images/contactus_mo.jpg',1)"><img src="images/contactus.jpg" name="Image4" width="98" height="28" border="0" id="Image4" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/icmember_mo.jpg',1)"><img src="images/icmember.jpg" name="Image5" width="156" height="28" border="0" id="Image5" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/joinnow_mo.jpg',1)"><img src="images/joinnow.jpg" name="Image6" width="93" height="28" border="0" id="Image6" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','images/invite_mo.jpg',1)"><img src="images/invite.jpg" name="Image7" width="186" height="28" border="0" id="Image7" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','images/icspomsorship_mo.jpg',1)"><img src="images/icsponsorship.jpg" name="Image8" width="225" height="28" border="0" id="Image8" /></a>
Can someone tell me how to do that and maybe send me the javascript for it please...

Aug 18 '08 #1
5 4067
5,390 Expert Mod 4TB
you just show MM Dreamweaver Code ... which is a commercial application ... what do you really want to have? explain your requirement in more detail in case you need your 'own' script ... otherwise just use your dreamweaver and a tutorial to generate it with that application ... for most people its just a pain to work with dreamweaver code since often not all used code is pasted here ... its even inefficient in most cases ... since it is more a layout then a programming tool ... but that's just my personal opinion :)

kind regards
Aug 18 '08 #2
Basically what I want to do is the following..

1) Have a roll-over images as the main menu
2) upon clicking one of those images a submenu will show up underneath that image
3) the submenu is a roll-over images

That's all in plain simple...

The scripts that I have is being created by ImageReady application and I don't really want to use that.

Can someone please help me.
Aug 18 '08 #3

I have 7 main roll-over images that I need to create an expandable submenus using roll-over images as well.

So when a user clicks on one image a submenu appears beneath it with roll-over images as well.

Can someone please help me with a scripts to do that.

Aug 18 '08 #4
5,390 Expert Mod 4TB
what have you done so far? there are some menu-generators out there on the web ... in case you want to do something for yourself then we should start to work at it together ... first show an example of the html you have and that is related to this requirement. may be you have done some javascript-code too?

the rules at this forum state that we don't give just complete solutions ... this is a programming help forum so in case you need help with your! code you are very welcome ... but show some effort to solve the problem first and then we may show you how to go on with it ... ok?

kind regards
Aug 19 '08 #5
16,027 Expert Mod 8TB
Threads merged. Please do not double post your question. Thanks.

Aug 19 '08 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

by: erikd | last post by:
I'm using an expanding tree menu based on the design from Dieter Bungers GMD (www.gmd.de) and infovation (www.infovation.de) named displayToc.js. The problem is that the script isn't working...
by: Miguel Dias Moura | last post by:
Hello, I created a datalist in an ASP.Net / VB page. I display the image and price of a few products. When a user clicks an image I want to load the page "detail.aspx?number=id" and send the...
by: Bryan | last post by:
I am attempting to make a web page more Netscape friendly... <a href="http:www.gordonceilings.com"></a> I have already corrected the table issues in an offline staging site (where I do the...
by: Enrika | last post by:
Greetings! I'm working on a CSS drop-down menu, which, to my surprise, is actually working, more-or-less, in both IE *and* Firefox (and Netscape). But there are two changes that I want to make that...
by: Jonathan | last post by:
Hello All, I am in the process of creating a 2/3 level collapsible/exspanible menu (called "nav") where users can click on a category and have the submenus appear beneath it and so on (allow...
by: az538 | last post by:
Hello All, I am having a problem with my menu and submenu system. It works like a champ in IE6 and Firefox but IE7 renders the submenus in incorrect positions on the page. Also, the menu system...
by: omerbutt | last post by:
hi every one i have a menu li and ul based the problem is when any specific category in the li is hovered the li or the sub-cat items appear but as i move my mouse over the sub-cat or level two li it...
by: dharmbhav | last post by:
Hello all, I am trying to develop a roll-over menu effect on a page. It works fine with all other browsers except IE6. Can some one please help me? HTML: <div class="menu-item-wrap">...
by: abbasky | last post by:
### Vandf component communication method one: data sharing ​ Vandf components can achieve data exchange through data sharing, state sharing, events, and other methods. Vandf's data exchange method...
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
by: fareedcanada | last post by:
Hello I am trying to split number on their count. suppose i have 121314151617 (12cnt) then number should be split like 12,13,14,15,16,17 and if 11314151617 (11cnt) then should be split like...
by: egorbl4 | last post by:
Скачал я git, хотел начать настройку, а там вылезло вот это Что это? Что мне с этим делать? ...
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
by: Aftab Ahmad | last post by:
So, I have written a code for a cmd called "Send WhatsApp Message" to open and send WhatsApp messaage. The code is given below. Dim IE As Object Set IE =...
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...

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.