<div onmouseover="start(<? echo $row['id'];?>)" onmouseout="stop(<? echo $row['id'];?>)" style="height:100px width:816px">

<div id="thediv<? echo $row['id'];?>" style="background-image:url(pasek<? echo $row['cat']; ?>dol.PNG);background-repeat:no-repeat;background-position:-816px 0px; height:1px; width:816px;">
</div>

var pos = 0;
var stop_anim = 0;
var x=-816;
var y=0;
var divio = 0;

function changePosition(posx)
{
var posy = 0;
pos = pos + posx;
if (stop_anim == 1) return 1;
if (pos == 816) {
    pos = 0;
    stop_anim = 1;    
    document.getElementById('cdiv'+divio).style.display = 'block';
    document.getElementById('cdivm'+divio).style.display = 'block';
    return 1;
}
document.getElementById('thediv'+divio).style.backgroundPosition=x+pos+"px "+y+"px";
setTimeout('changePosition(5)', 3);
}

function stop()
{
stop_anim = 1;
document.getElementById('thediv'+divio).style.backgroundPosition=x+"px "+y+"px";
document.getElementById('cdiv'+divio).style.display = 'none';
document.getElementById('cdivm'+divio).style.display = 'none';
}

function start(id)
{
stop_anim = 0;
divio = id;
pos = 0;
changePosition(1);    
}

if (pos == 816) {

if (pos >= 816) {
pos = 816;