Solved

How to make roll over like microsoft.com

Posted on 2001-06-20
18
177 Views
Last Modified: 2010-04-25
I would like to make roll overs, just like microsoft has done that is if u move ur mouse  over HOME or Micorsoft  or... U see a drop down menu with links how to do that. and also the coulmen roll over
0
Comment
Question by:fmufti
  • 11
  • 4
  • 3
18 Comments
 

Expert Comment

by:RGB-Visuals
ID: 6217108
The way I do that is to use a CSS style sheet. Dreamweaver help explains what all the options are.

It you want a code for a drop down menu try www.dhtml.com
they have codes and help to set it up.

need more details?
0
 

Author Comment

by:fmufti
ID: 6218267
Can u be specifc as to how can we do it in Dreamweaver, if possible  step by step
I 'll be gretful as I am not an expertin easy stepsstep by step
0
 

Author Comment

by:fmufti
ID: 6218271
Also I dont know much of HTML
0
 

Expert Comment

by:RGB-Visuals
ID: 6221101
Step 1

Right click CSS Style> new style

Step 2

Type> use css selector
Selector> a:active

Define in> (here you have the option of saving the css style in the document or as a file. It's better to save it as a file, then other documents can use it as well.)
so pick the the top option, new style sheet file.

Step 3
hit OK, now it will ask you to save the sheet.

Step 4
here is where you tell it what to look like.
(for more in this part hit the help button, it brings up html page from your hard drive, with all the setup options)

Step 5
repeat this 3, but step 2 will be different now.
for the Selector, pick next after a:active and tell it to Define in the style just saved (it should be in the list)

some background info
these links have 4 parts
a:active - what you see when the link is active
a:hover - what you see when you move over the link
a:link - what link looks like normally
a:visited - what link looks like after you've been to the linked site

I hope this helps
good luck

Steven
0
 

Expert Comment

by:RGB-Visuals
ID: 6221111
oops, fix two mistakes

step 1
Right click (anywhere on a doc, in dreamweaver) CSS Style> new style

Step 5
repeat this 3 times, but step 2 will be different each time now.
for the Selector, pick the second one down (the third time pick the third one down and so on)

then tell it to Define in the style just saved (it should
be in the list)

I hope this helps
good luck

Steven
0
 

Author Comment

by:fmufti
ID: 6222448
Hi
What u have writetn was just a simple way of modifying links by CSS, that I am already doing but on the link a:hover how to drop amenu???that is my question. making links cahnges with CSS I already new, so may be we can step forward
0
 

Expert Comment

by:RGB-Visuals
ID: 6222550
CSS aren't used for most drop menus.
I don't know how Microsoft has done their menus, but
I know how to do one like it, go www.bac.qld.edu.au
if you like those menus I can tell you how to set them up.

In setting up most drop down menus, it help if you know a bit about java.

If you don't like the type of menus at www.bac.qld.edu.au you could try looking at Macoromdia Excahange (http://www.macromedia.com/exchange/).
They have over 400 Extensions for Dreamweaver, all free all you need is macromedia ID (also free).

That help?

Steven
0
 

Author Comment

by:fmufti
ID: 6223245
This site www/bac.gld.edu.au doesnt work its displays a message saying
               Offline!
The DynIP customer you are trying to reach is
not connected to the Internet right now
0
 
LVL 8

Expert Comment

by:klykken
ID: 6231223
css _is_ used for dropdown menus. It is just a more advanced way of using them (and combinding them with javascript).

Go to: http://www.projectseven.com/dreamweaver/index.htm
Click the tutorial link on the top and there you will find a tutorial how to make a microsoft menu, with dreamweaver.

Good Luck :-)
--
klykken
0
Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

 

Author Comment

by:fmufti
ID: 6232624
I had already downloaded that one and working on it.
So suggest me some other so that I can reward u with the points.
0
 
LVL 8

Accepted Solution

by:
klykken earned 100 total points
ID: 6232728
fmufti;
sure i can, although i think the one from projectseven definately is the best.
http://www.mikejen.com/Resources%20stuff/Making%20a%20Fly%20Out%20Menu.htm

This page also have links to additional pages that might be of help. Likt his one which is another tutorial doing the microsoft menu:
http://kjostudio.tripod.com/menu/tutorial.html

the first tutorial as pdf:
http://www.mikejen.com/Resources%20stuff/Making%20a%20Fly%20Out%20Menu.pdf

..and looking through the comments I remember how important it is to seperate java from javascript and knowing that they are not the same thing :-)
--
klykken
0
 

Author Comment

by:fmufti
ID: 6236805
Thanx
0
 

Author Comment

by:fmufti
ID: 6236807
Can I contact u again if I have any problem as I may not have time to work on the tutorial for 2-3 days??
0
 

Author Comment

by:fmufti
ID: 6253285
There are few points which I could not understand. please explain them to me.
1. Why all layers are palced at the same position on the page( Top left)
2. Why the transparent GIF is larger than the layer
     a. By what proportion it should be larger
     b. What if the Transparent GIF Layer is of the same size of Layer-SANP
3. Why there is a tranparent GIF(shim ) in the first cell of the five coulm table.
4. How to give dimensions to image so that we can user PRESETS
0
 

Author Comment

by:fmufti
ID: 6255064
klykken  WHERE ARE U???
0
 
LVL 8

Expert Comment

by:klykken
ID: 6255324
fmufti,
I am not sure which document you are speaking about. If this is for yuor own home page, I need to see the source, either by you giving me the url, or give me the code you are using.
Or if this is concerning one of the tutorials, please specify which one.
--
klykken
0
 

Author Comment

by:fmufti
ID: 6255433
I am talking of Project seven drop down menu tutorial
0
 

Author Comment

by:fmufti
ID: 6258235
Project VII seems to have replaced the previous Snap and Auto layer Tutorial with their lates one, so I am going to read this one, So will u be available  after the weekend to discuss if at all there is any help I need ?????
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

I still run into .cgi files every now and then. In some instances, I actually prefer the simplicity of a .cgi script to other options. Since I use DreamWeaver extensively, what I needed was a way to open .cgi scripts in Dreamweaver. And I wanted to …
Adobe Dreamweaver CS5 is a WYSIWYG web page editor that has advanced HTML, CSS, and Javascript rendering functionality and is probably the most well-known HTML editor available. Much of Dreamweaver's appeal centers around the Design View interfac…
Get a first impression of how PRTG looks and learn how it works.   This video is a short introduction to PRTG, as an initial overview or as a quick start for new PRTG users.
When you create an app prototype with Adobe XD, you can insert system screens -- sharing or Control Center, for example -- with just a few clicks. This video shows you how. You can take the full course on Experts Exchange at http://bit.ly/XDcourse.

762 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

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now