- Автор темы
- #1
Задача: Поправить существующий скрипт, а именно, чтобы при наведении мыши на обьект менял цвет. На данный момент, все работает, только действие при нажатии на объект. Хотелось бы, данное действие выполнялось при наведении мыши.
Пытался сменить вместо .click на .onmouseover. Не получилось, может быть кто нибудь сталкивался с данной проблемой?
Здесь мой код.
Пытался сменить вместо .click на .onmouseover. Не получилось, может быть кто нибудь сталкивался с данной проблемой?
Здесь мой код.
PHP:
<script type="text/javascript" src="jquery-1.2.6.pack.js"></script>
<script type="text/javascript">
var $j = jQuery.noConflict();
$j(document).ready(function(){
$j("th.one").click( function(){ $j
("#tt").removeClass("bg2 , bg3 , bg4 , bg5 , bg6 , bg7 , bg8 , bg9 , bg10 , bg11").addClass("bg1");
});
$j("th.two").click( function(){ $j
("#tt").removeClass("bg1 , bg3 , bg4 , bg5 , bg6 , bg7 , bg8 , bg9 , bg10 , bg11").addClass("bg2");
});
$j("th.three").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg4 , bg5 , bg6 , bg7 , bg8 , bg9 , bg10 , bg11").addClass("bg3");
});
$j("th.four").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg5 , bg6 , bg7 , bg8 , bg9 , bg10 , bg11").addClass("bg4");
});
$j("th.five").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg4 , bg6 , bg7 , bg8 , bg9 , bg10 , bg11").addClass("bg5");
});
$j("th.six").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg4 , bg5 , bg7 , bg8 , bg9 , bg10 , bg11").addClass("bg6");
});
$j("th.seven").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg4 , bg5 , bg6 , bg8 , bg9 , bg10 , bg11").addClass("bg7");
});
$j("th.eight").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg4 , bg5 , bg6 , bg7 , bg9 , bg10 , bg11").addClass("bg8");
});
$j("th.nine").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg4 , bg5 , bg6 , bg7 , bg8 , bg10 , bg11").addClass("bg9");
});
$j("th.ten").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg4 , bg5 , bg6 , bg7 , bg8 , bg9 , bg11").addClass("bg10");
});
$j("th.eleven").click( function(){ $j
("#tt").removeClass("bg1 , bg2 , bg3 , bg4 , bg5 , bg6 , bg7 , bg8 , bg9 , bg10").addClass("bg11");
});
});
</script>
<style type="text/css">
ul
{
list-style-type:none;
}
li
{
float:left;
}
.bg1 { background-color: #ffffff; }
.bg2 { background-color: #e5e5e5; }
.bg3 { background-color: #cccccc; }
.bg4 { background-color: #b3b3b3; }
.bg5 { background-color: #999999; }
.bg6 { background-color: #808080; }
.bg7 { background-color: #666666; }
.bg8 { background-color: #4d4d4d; }
.bg9 { background-color: #333333; }
.bg10 { background-color: #1a1a1a; }
.bg11 { background-color: #000000; }
</style>
<table width="300" border="0" cellspacing="1" cellpadding="0">
<tr>
<th scope="col" bgcolor="#FFFFFF" class="one"><a href="#"> </a></th>
<th scope="col" bgcolor="#e5e5e5" class="two"><a href="#"> </a></th>
<th scope="col" bgcolor="#cccccc" class="three"><a href="#"> </a></th>
<th scope="col" bgcolor="#b3b3b3" class="four"><a href="#"> </a></th>
<th scope="col" bgcolor="#999999" class="five"><a href="#"> </a></th>
<th scope="col" bgcolor="#808080" class="six"><a href="#"> </a></th>
<th scope="col" bgcolor="#666666" class="seven"><a href="#"> </a></th>
<th scope="col" bgcolor="#4d4d4d" class="eight"><a href="#"> </a></th>
<th scope="col" bgcolor="#333333" class="nine"><a href="#"> </a></th>
<th scope="col" bgcolor="#1a1a1a" class="ten"><a href="#"> </a></th>
<th scope="col" bgcolor="#000000" class="eleven"><a href="#"> </a></th>
</tr>
</table>