Jump to content
  • 0

Сделать выпадающее меню выплывающим!

Slashka

Asked by Slashka,

 Share

Question

Slashka Explorer

Slashka

Posted
Posted

Я сделала выпадающее меню (html+css), немного неровно, но это неважно.

В общем, можно ли немного изменить мой код (напр. добавить скрипты), чтобы меню появлялось не сразу, а постепенно, как бы выплывало?

html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<div class="menu_up">	
		<div class="menu_links1">
				<b><a href="#">О компании</a>
				 <ul> 
					<li><a href="">О компании1</a> 
					</li>
					<li><a href="#">О компании2</a>
					</li> 
					<li><a href="#">О компании3</a></li> 
				 </ul> 
			 </b>
		</div>
	</div>
</body>
</html>

css:

.menu_links1{ float:left; padding:27px 0px;}
.menu_links1 a{ text-decoration:none;}


.menu_links1 b ul{
position:absolute;
display:none;
border:1px solid black;
font-size: 12px;
line-height: 18px;
z-index: 100;
background-color: #CCFFFF;
width: 150px;
list-style: none;
top:42px;
}


.menu_links1 b ul a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
text-indent: 5px;
}

.menu_links1 b ul a:hover{
background-color: #6699FF;
color: #FFFFFF;
}

.menu_links1 b:hover ul{ display:block;}

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

Guest
This topic is now closed to further replies.
 Share
Go to question listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept