Честно сказать, ничего не понял я в твоем коде, какая то белиберда. Вот ради шутки тебе состряпал простенькую менюшку из 5 ти пунктов. При наведении на пункт меню, картинка меняется на "2.png" -- это средствами CSS. Ну и если нужно, чтобы при заходе на страницу, выделялся этот пункт меню, в моем примере делается активной картинка, опять же "2.png". Код с тегом
<script> -- прописываешь на той странице, куда ведет ссылка, естественно меняешь идентификатор на соответствующий. Удачи!
<style>
li {
width: 100px;
height: 40px;
background: url(1.png) blue repeat-x;
display: block;
float: left;
}
/* Изображение должно быть 40px в высоту,
в ширину естественно чем меньше, тем лучше =)
*/
li:hover {
background: url(2.png) blue repeat-x;
}
a {
width: 100px;
height: 40px;
display: block;
cursor: pointer;
text-align: center;
padding-top: 10px;
}
</style>
<script>
//--- Этот скрипт (с тегом <script>) прописываешь на каждой странице
//--- на которую ведет ссылка, естественно меняешь "id"
window.onload = function(){
document.getElementById('one').style.backgroundImage = 'url(2.png)';
}
</script>
<ul>
<li id="one">
<a href="#">Первый</a>
</li>
<li id="two">
<a href="#">Второй</a>
</li>
<li id="three">
<a href="#">Третий</a>
</li>
<li id="four">
<a href="#">Четвертый</a>
</li>
<li id="five">
<a href="#">Пятый</a>
</li>
</ul>