Главная Наши работы Работы друзей Мы рекомендуем О ремонте...@ почта

 

 


Статистика посещений

Читать новости

опросы и голосования

 

Resurs.kz: сайты Казахстана и раскрутка сайта

Фото при наведении увеличивается после ухода курсора уменьшается

Небольшой скрипт для установки скопируйте код между тегами <head>-</head>
и вставьте у себя на странице также между тегами <head>-</head>


<head>

<style>
.clss2{ position:absolute;width:40px;background-color:#c3bfa4;border:2px outset #c3bfa4;color:red;text-align:center;z-index:5;cursor:hand}
</style>
<script type="text/javascript">
<!--
function initObj(){ // create objects
my_object1=new create("div1")
my_object2=new create("div2")
my_object3=new create("div3")
maxWidth=450
minWidth=40
}
function create(id){ //define properties, pass id
this.id=id
this.width=document.getElementById(this.id).width
this.pos=parseInt(document.getElementById(this.id).style.left)
this.start_pos=this.pos
this.timer=null
this.running=0
this.chk_status=function(num,d){ // method & its properties, pass div number as argument
this.dir=d
if(this.dir=="zOut"){this.running=0}
if(this.dir=="zIn"&&this.running==1){return}
this.running=1
this.step=5//+Math.floor(Math.random()*9)
window["my_object"+num].animate('my_object'+num)
}
this.animate=function(myobject){ // method & its properties, pass object name as argument
if(this.dir=="zIn"){
document.getElementById(this.id).style.zIndex=10
this.width+=this.step
this.pos-= this.step/2
}
else{
document.getElementById(this.id).style.zIndex=""
this.width-=this.step/4
this.pos+= (this.step/2)/4
}
this.timer=setTimeout(myobject+".animate('"+myobject+"')",10)
if(this.dir=="zIn"&&this.width>maxWidth-this.step){
this.width=maxWidth
//this.pos=
this.running=0
clearTimeout(this.timer)
}
if(this.dir=="zOut"&&this.width<=minWidth+this.step){
this.width=minWidth
this.pos=this.start_pos
this.running=0
clearTimeout(this.timer)
}
document.getElementById(this.id).style.width=this.width
document.getElementById(this.id).style.left=this.pos
}
}
// add onload="initObj()" to the opening BODY tag
// -->
</script>


</head>

Втоую часть скрипта между тегами <body>-</body>вставьте у себя на странице там где вы хотите также
между тегами<body>-</body>.Измените пути к вашим фотографиям "images2/00002.jpg".А так же размер фотографий.


<body onload="initObj()">


<IMG src="../00001.jpg" id="div1" class="clss2" style="left:100;top:10" onmouseover="my_object1.chk_status(1,'zIn')" onmouseout="my_object1.chk_status(1,'zOut')"> <IMG src="../00002.jpg" id="div2" class="clss2" style="left:180;top:10" onmouseover="my_object2.chk_status(2,'zIn')" onmouseout="my_object2.chk_status(2,'zOut')"> <IMG src="../00003.jpg" id="div3" class="clss2" style="left:260;top:10" onmouseover="my_object3.chk_status(3,'zIn')" onmouseout="my_object3.chk_status(3,'zOut')"> <DIV class="copy"></DIV>


</body>