Вот полный пример...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
<title>Заголовок</title>
<meta http-equiv="content-type" content="text/html; charset=windows-1251"/>
<link href="css/style.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript">
<!--
var doc=document;
function pereezd(photoGo,x0,y0,x1,y1){
pgo=photoGo;
count=0; //счетчик
x=x0; // x0,y0 - "нулевые" точки; x1,y1 - конечные точки
y=y0;
vremya=10; // время задержки(в принципе скорость)
step=500; // частота шага
stepX=(x1-x0)/step;
stepY=(y1-y0)/step;
moveto();
}
function moveto(){
if(count < step){
count++ ;
x += stepX;
y += stepY;
obg=doc.getElementById(pgo).style;
obg.left=x;
obg.top=y;
setTimeout("moveto()",vremya);
}
}
//-->
</script>
</head>
<body>
<div id="body">
<div id="header">Текст</div>
<div id="menu">
<div><a href="#">Меню1</a></div>
<div><a href="#">Меню2</a></div>
</div>
<div id="info">
<div id="photo"><a class="welcome" onmouseover="pereezd('imgZador',220,69,550,69)" onmouseout="pereezd('imgZador',550,69,220,69)">"П ри наведении на текст..."</a><br/>
<div id="imgZador"><imgalt="Изображение" src ='images/image1.jpg'></div>
</div>
<p>текст</p>
</div>
</body>
</html>
вот Css
body{
margin:0;
padding:0;
background:#c2ddfe;
}
#header{
height:50px;
min-width:600px;
background:#688DCD;
text-align: center;
font-size: 25px;
}
#menu{
width:200px;
float:left;
background:#c2ddfe;
}
#menu div {
padding: 2px;
}
#photo{
min-width:350px;
height:280px;
background: #e1e6f8;
padding: 0px 10px 10px 10px;
}
#imgZador{
position:absolute;
}
#info{
font-family: Arial, Helvetica, sans-serif;
min-width:350px;
min-height:450px;
margin-left:200px;
background: #e1e6f8;
padding: 0px 10px 10px 10px;
font-size: 12px;
color: #000000;
text-align: justify;
text-indent: 1.5em;
vertical-align: top;
}
.welcome{
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
color: #3462AD;
padding-left: 10px;
padding-bottom: 9px;
}
img{
margin: 5px 5px 5px 5px;
border:0;
}
