| |
|
|
| | Всем привет!!! Часто встречается мне на сайтах меню, когда на водишь курсор на ссылку, то она выделяется другим цветом. Скорее всего это на js реализовано, я его не очень хорошо знаю, может кто поможет как это можно реализовать??? | |
| |
|
|
| |
|
|
| |
для: V@ldem@r
(18.01.2008 в 18:24)
| | | есть такое замечательное css свойство, точнее пвсевдо класс :hover | |
| |
|
|
| |
|
|
| |
для: CrazyAngel
(18.01.2008 в 19:26)
| | | И как его применить??? Приведите примерчик небольшой пожалуйста!!! Если можно, конечно!!! | |
| |
|
|
| |
|
|
| |
для: V@ldem@r
(18.01.2008 в 19:27)
| | |
...
<head>
<style>
a{
color:red;
}
a:hover{
color:green;
}
</style>
</head>
<body>
<a href="#">Моя ссылка</a>
...
|
Есть еще другие псевдоклассы
a:link
a:visited
a:active
Но это уже сами попробуйте. | |
| |
|
|
| |
|
|
| |
для: jangot
(18.01.2008 в 19:37)
| | | Спасибо, но мне нужно немножко не то!!! Нужно чтобы при наведении на ссылку она выделялась например небольшим прямоугольником серого цвета!!!Вот прикрепил картинку, где указан пример такой менюшки!!! | |
| |
|
|
| |
|
|
| |
для: V@ldem@r
(18.01.2008 в 19:47)
| | | в вашем случае лучше применять классы к ячейкам таблицы или слоям (div). примерно так:
<table width="100" height="360" cellspacing="0" cellpadding="0" border="0">
<tr>
<td height="100" width="20"> </td>
</tr>
<tr>
<td align="center">
<div class=lmNormal style='font-weight:normal; cursor:hand; width:90; height:20'
onMouseDown=this.className='lmClick'
onMouseUp=this.className='lmMouseOver'
onMouseOver=this.className='lmMouseOver'
onMouseOut=this.className='lmNormal'>
<A HREF="main.html" target="center">PHOTO</A></div>
</td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr>
<td align="center"><div class=lmNormal style='font-weight:normal; cursor:hand; width:90; height:20'
onMouseDown=this.className='lmClick'
onMouseUp=this.className='lmMouseOver'
onMouseOver=this.className='lmMouseOver'
onMouseOut=this.className='lmNormal'>
<A HREF="facil.html" target="center">FACILITIES</A></div>
</td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr>
<td align="center">
<div class=lmNormal style='font-weight:normal; cursor:hand; width:90; height:20'
onMouseDown=this.className='lmClick'
onMouseUp=this.className='lmMouseOver'
onMouseOver=this.className='lmMouseOver'
onMouseOut=this.className='lmNormal'>
<A HREF="cont.html" target="center">CONTACT</A></div>
</td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr>
<td align="center"><div class=lmNormal style='font-weight:normal; cursor:hand; width:90; height:20'
onMouseDown=this.className='lmClick'
onMouseUp=this.className='lmMouseOver'
onMouseOver=this.className='lmMouseOver'
onMouseOut=this.className='lmNormal'>
<A HREF="form.html" target="center">RESERVATION FORM</A></div></td>
</tr>
<tr>
<td height="10"></td>
</tr>
</table>
|
и стили:
.lmNormal
{
BACKGROUND-COLOR:transparent;
BORDER-BOTTOM:medium none;
BORDER-LEFT:medium none;
BORDER-RIGHT:medium none;
BORDER-TOP:medium none;
MARGIN-BOTTOM:2px;
MARGIN-LEFT:1px;
MARGIN-TOP:1px;
PADDING-BOTTOM:4px;
PADDING-LEFT:6px;
PADDING-TOP:2px
}
.lmMouseover
{
BACKGROUND-COLOR:#eda86f;
BORDER-BOTTOM:#2e0e03 solid thin;
BORDER-LEFT:#e7d0be solid thin;
BORDER-RIGHT:#2e0e03 solid thin;
BORDER-TOP:#e7d0be solid thin;
MARGIN-BOTTOM:2px;
MARGIN-LEFT:1px;
MARGIN-TOP:1px;
PADDING-BOTTOM:2px;
PADDING-LEFT:4px
}
.lmClick
{
BACKGROUND-COLOR:#985f34;
BORDER-BOTTOM:#e7d0be solid thin;
BORDER-LEFT:#2e0e03 solid thin;
BORDER-RIGHT:#e7d0be solid thin;
BORDER-TOP:#2e0e03 solid thin;
COLOR:#ffffff;
FONT-SIZE:100%;
MARGIN-LEFT:1px;
MARGIN-BOTTOM:2px;
MARGIN-TOP:1px;
PADDING-BOTTOM:2px;
PADDING-LEFT:4px
}
|
| |
| |
|
|
| |
|
|
| |
для: V@ldem@r
(18.01.2008 в 19:47)
| | | тогда
a:hover {
background:url(pic.jpg);
}
|
В css помощью hover можно присваивать любые стили любому элементу элементу, но в ie6 и ниже только ссылкам.
что бы ссылке задать размеры можно присвоить ей значение display:block;
Работает везде а писать меньше | |
| |
|
|
| |
|
|
| |
для: jangot
(18.01.2008 в 20:01)
| | | Спасибо огромнейшее!!! Очень выручили, всего вам хорошего и побольше!!! | |
| |
|
|
| |
|
|
| |
для: V@ldem@r
(18.01.2008 в 20:06)
| | | можно и так
DIV.c_menu a.navi{
padding: 1px 1px 2px 4px;
letter-spacing:1px;
float: left;
cursor: pointer ;
width: 180px;
background-color: #ffffff;
FONT-SIZE: 9pt; COLOR: #12578E; font-weight: normal;
}
DIV.c_menu a.navi:hover{
padding: 1px 1px 2px 4px;
letter-spacing:1px;
float: left;
cursor:pointer ;
width: 180px;
background-color: #EFEEEE;
FONT-SIZE: 9pt; COLOR: #cc3333; font-weight: lighter;
}
<div class=c_menu><a class= navi
|
| |
| |
|
|
