Динамика в меню.

I159 · May 16, 2010

Привет. Есть плашка меню, она являет собой одну картинку, на ней текстовое меню (z-index). Нужно, чтобы при наведении курсора на область каждого пункта меню появлялась кнопка, а без курсора просто плашка с текстом. Возможно ли это сделать на css? Если да, то как?

 <html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<img src="logo.png" id="logo">
<ul>
<li><a href="#">óñëóãè</a></li>
<li><a href="#">çàêàçàòü</a></li>
<li><a href="#">ñîòðóäíè÷àòü</a></li>
<li><a href="#">ïîçâîíèòü</a></li>
</ul>
<img src="buttomfeald.png" id="buttomfeald">
<img src="area.png" id="area">
<img src="big.png" id="big">
<img src="big.png" id="big1">
<img src="footer.png" id="footer">
<a class="buttom1" href="#"><img src="buttom.png"></a>
</body>
</html>

body {
background-color: #FFFFFF;
background-image: url("tree.png");
background-repeat: no-repeat;
background-position: 20px 125px;
}
#logo 
{
position: relative;
top: 10px;
left: 30px;
height: 95px;
width: 220px;
}

#buttomfeald 
{
position: absolute;
top: 45px;
left: 300px;
width: 711px;
height: 60px;
z-index: 1;
}

a.buttom1 img
{
position: absolute;
width: 138px;
height: 44px;
top: 53px;
left: 310px;
z-index: 2;
display: none;
}

a.buttom1:hover img
{
position: absolute;
width: 138px;
height: 44px;
top: 53px;
left: 310px;
z-index: 2;
}

ul 
{
position: absolute;
  top: 50px;
  left: 275px;
  font:bold 12pt sans-serif;
  z-index: 3; 
}
ul li
{
  list-style:none;
  margin:35;
  display:inline; 
}

a
{text-decoration: none;}

#area
{
position: absolute;
top: 125px;
left: 300px;
height: 600px;
width: 700px;
}

#big
{
position: absolute;
top: 800px;
left: 280px;
}

#big1
{
position: absolute;
top: 875px;
left: 280px;
}

#footer
{
position: absolute;
left: 0px;
top: 1000px;
height: 80px;
width: 1010px;
}

psywalker · May 16, 2010

Сделай у кнопки вместо имг обычный бг в ЦСС и меняй его при ховере, вот и всё.

I159 · May 16, 2010

Сделай у кнопки вместо имг обычный бг в ЦСС и меняй его при ховере, вот и всё.

Картинку в бекграунд тексту-ссылки, на ховере, попробовал загнать вот этим способом, но у меня не работает, не понятно.

Edited May 16, 2010 by I159

psywalker · May 16, 2010

Да сделай обычным, в оберни кнопки дивами, на них фон повесь, а при наведении меняй его, да и всё

Searcher · May 17, 2010

I159, покажите, что сделали.

I159 · May 18, 2010

I159, покажите, что сделали.

Всё, сообразил. Вопрос снят)

Sign In

Динамика в меню.

Question

I159

Link to comment

Share on other sites

5 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

I159

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

I159

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information