|
|
|
| Как сделать, при наведение на сылку, что бы она не сразу цвет меняла, а плавненько переливалась в другой цвет? :) | |
|
|
|
|
|
|
|
для: DelbI4
(30.04.2006 в 07:00)
| | пример можно увидеть? | |
|
|
|
|
|
|
|
для: codexomega
(30.04.2006 в 07:16)
| | Ну, к примеру, это реализовано вот тут: http://vivasvat.ru/ | |
|
|
|
|
|
|
|
для: ruark
(30.04.2006 в 07:39)
| | Примерно так, но тока что бы перелилась и все. а не мигала :) и после уберания тоже плавно на стандартный цвет переливалась :) | |
|
|
|
|
|
|
|
для: DelbI4
(30.04.2006 в 08:36)
| |
col = new Array()
col[0]="111111"
col[1]="111111"
col[2]="222222"
col[3]="333333"
col[4]="444444"
col[5]="555555"
col[6]="666666"
col[7]="777777"
col[8]="888888"
col[9]="999999"
col[10]="AAAAAA"
col[11]="BBBBBB"
col[12]="CCCCCC"
col[13]="DDDDDD"
col[14]="EEEEEE"
col[15]="FFFFFF"
col[16]="FFFFFF"
col[17]="DDDDDD"
col[18]="CCCCCC"
col[19]="BBBBBB"
col[20]="AAAAAA"
col[21]="999999"
col[22]="888888"
col[23]="777777"
col[24]="666666"
col[25]="555555"
col[26]="444444"
col[27]="333333"
col[28]="222222"
col[29]="111111"
col[30]="111111"
i_col=0
doani=1
var timer
var thislink
function animatelink() {
if (document.all) {
if (doani==1) {
if (i_col<=col.length-1) {
thislink.color=col[i_col]
i_col++
timer=setTimeout("animatelink()",50)
}
else {
i_col=0
timer=setTimeout("animatelink()",50)
}
}
else {
clearTimeout(timer)
}
}
}
function stopanimation() {
clearTimeout(timer)
thislink.color="#dadada"
doani=0
}
function startanimation(mylink) {
clearTimeout(timer)
thislink=eval("document.all."+mylink+".style")
doani=1
animatelink()
}
|
цвета можно менять | |
|
|
|
|
 2.6 Кб |
|
|
для: DelbI4
(30.04.2006 в 07:00)
| | несовсем в тему но есть интересное решение на ксс для графических ссылок и меню:
вот код:
<!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" />
<title>МУ “ЦЕНТРАЛИЗОВАННАЯ БУХГАЛТЕРИЯ КУЛЬТУРЫ МО ТУАПСИНСКИЙ РАЙОН”</title>
<style type="text/css">
<!--
body
{
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 10px;
color : #363636;
margin-left : 0px;
margin-top : 0px;
margin-right : 0px;
margin-bottom : 0px;
background-image : url(_images/bg.png);
}
a:link, a:visited, a:active, a:hover
{
text-decoration : none;
}
a:hover
{
text-decoration : underline;
}
#menu
{
width : 755px;
height : 33px;
position : relative;
top : 8px;
bottom : 0px;
left : 1px;
right : 1px;
background-image : url(_images/btn.gif);
}
#nav
{
height : 33px;
margin : 0;
padding : 0;
list-style : none;
overflow : hidden;
display : inline;
}
#nav li
{
margin : 0;
padding : 0;
list-style : none;
display : inline;
}
#nav a
{
height : 0px !important;
height /**/ : 33px; /* for IE5/Win only */
padding : 33px 0 0 0;
float : left;
overflow : hidden;
}
#nav a:hover, #nav a:active
{
background-position : 0 -33px;
text-decoration : none;
}
#nav a.selected
{
background-position : 0 -66px;
}
#tlink-empty a, #tlink1 a, #tlink2 a
{
padding-right : 1px;
background : url(btn.gif) top left repeat-x;
display : block;
}
#tlink-empty a
{
width : 754px;
}
#tlink1 a
{
width : 192px;
}
#tlink2 a
{
width : 204px;
}
#blank a
{
width : 1px;
background-color : #363636;
display : block;
}
#nav_txt
{
font-weight : bold;
color : #FFFFFF;
margin-left : 35px;
margin-top : -18px;
position : absolute;
z-index : 3;
}
-->
</style>
</head>
<body>
<div id="menu">
<ul id="nav">
<li id="tlink1"><a class="selected"><span id="nav_txt">ГЛАВНАЯ СТРАНИЦА</span></a></li>
<li id="blank"><a></a></li>
<li id="tlink2"><a href="#" style="cursor:pointer;"><span id="nav_txt">ИЗМЕНИТЬ РЕКВИЗИТЫ</span></a></li>
</ul>
</div>
</body>
</html>
|
и картинка в аттаче
для поставленной задачи картинку необходимо модернизировать так чтобы полоска с анимацией переходила из серого цвета в зеленый. | |
|
|
|