проблема onmouseover/out
 

всем привет!

У меня меню в виде картинок в class="Punkt",а в id="MainMenuUndeline" та же самая картинка, только с подчеркиванием. Как вы заметили, все выводится циклом.

Задача такая: при наведении на картинку, появлялась картинка с подчеркиванием.
Див с id="MainMenuUndeline" скрыт за счет visibility:hidden; ....в общем отсюда и пляшу в js.

Но почему-то не работает, подскажите, что не так в коде?

@foreach (Punkt punkt in Model.mainMenuPunktList)
        {
           <a class="Punkt" href="http://@Config.domain@punkt.Page.Url"
                style="background:url(/content/images/@punkt.ImageUrl) no-repeat;" onmouseout="hideUndeline('MainMenuUndeline')" onmouseover="showUndeline('MainMenuUndeline')" >
                
                <div id="MainMenuUndeline" style="background:url(/content/images/@punkt.MainColorHex) no-repeat;"></div>

           </a>
        }

#MainMenuUndeline {
     width:305px;
     height:149px;
     visibility:hidden;
}

function setVisible(objID, visible)
{
    var obj = document.getElementById(objID);
    obj.style.visibility = (visible) ? "visible" : "";
}

function showUnderline(objID)
{
    setVisible(objID, true);

}
function hideUnderline(objID) {
    setVisible(objID, false);

}

у меня есть еще вот такой вариант, но я не знаю как прописать в цикле для трех пунктов меню-картинок

function changePic(source){
			document.pic.src = source;
		};

<img onmouseout="changePic('pic/main_menu_1.png')"
			onmouseover="changePic('pic/main_menu_1_over.png')" class="img" src="pic/main_menu_1.png" name="pic">

уже не нужно, проблема решилась

использовала первый вариант, только в html использовала 2 img, один из них для оnmouseover, где использовала id="text+переменная" и вставляю его в hideUndeline,showUndeline