Dropdown Hover CSS

Question

Can someonehelp me to fix that dropdown menu that this site has neowin.net?

So far I have this; itbataljonen.com/test/ (Hover over "News")

What I can't figure out, is when i hover over for instance "News" -> "Apple", there should come some news with pictures, and they change if I hover over "Microsoft" and so on.

Could this be done via CSS or HTML?

To download the source files, just go to www.ITbataljonen.com/test and click Download Source in the navigation bar.

Can someone help me? :) (Sorry for my bad english..)

Yes. just use display:block and display:none with animation. — ketan
– ketan, Commented Mar 12, 2015 at 9:52

Suhas Gosavi · Accepted Answer · 2015-03-12 11:56:54Z

1

Working Fiddle

As you asked using css. Yes by using css it is possible to hide and show another div. You need to simply write hover event. This applies to "apple" and "microsoft" also.

Here is the css:

#a:hover + #b {
 background: #ccc;
    visibility: visible;
}
#b{
   visibility: hidden;
}

edited Mar 12, 2015 at 11:56

Suhas Gosavi

2,18020 silver badges41 bronze badges

answered Mar 12, 2015 at 10:07

Pranali Maske

1328 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 12:12:54Z

0

This can be done using hover property in CSS. Read this question to understand more.

And in your case, the images can be in a <ul id="news_images1"></ul> and you can set css hover property to animate this list of images. Remember, there are multiple ways to solve this issue. You can also checkout Jquery hover.

edited May 23, 2017 at 12:12

CommunityBot

11 silver badge

answered Mar 12, 2015 at 9:56

0aslam0

1,9716 gold badges29 silver badges44 bronze badges

Collectives™ on Stack Overflow

Dropdown Hover CSS

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related