|
| Дата: Вторник, 30.09.2014, 04:34 | Сообщение # 1 |
|
Группа: Администраторы
Сообщений: 1530
| <html>
<head>
<title>Rote_img</title>
<script type="text/javascript" src="http://s21.ucoz.net/src/jquery-1.7.2.js"></script>
<style type="text/css">
body {font-size:11px;margin:30px;}
.rote img{width:301px;height:301px;}
.dimg{float:left;margin:20px;}
.rote{width:330px;text-align:center;}
</style>
</head>
<body>
<div id="test">0</div>
<div id="0" class="rote"><img src="stock10-big-01-04.jpg" /></div>
<div id="1" class="rote"><img src="stock10-sm-01-04.jpg" /></div>
<script>
var i=1;//добавляем номер картинке
var i1="";//i с нулем спереди
var i2=0;//проверка на hover
var t;
var s1=""; //адрес картинки
var s2=""; //префикс картинки
var d1="";
var v=0;
$(".rote").hover(function(){
i=1;
i1="";
i2=1;
d1=this.id;
s1=$(".rote img").eq(d1).attr("src");
//s2=s1.replace("01.jpg","");
s4=s1.replace("04.jpg","08.jpg");
d2=$(".rote img").eq(d1);
t=setInterval("tm2(d2)",150);
$("#test").html(s4);
},
function(){
i2=0;
//this.src=s1;
$(".rote img").eq(d1).attr("src",s1);
$(".rote img").eq(d1).css("width","301px");
clearInterval(t);
i=1;
};);
function tm(x,y) { //функция, если есть разные виды картинок
i++;
if(i2!=0) {
if(i<10) i1="0"+i;
if(i>9) i1=""+i;
if(i>12) {
clearInterval(t);
i1="01";
}
if(i2=1) $(".rote img").eq(y).attr("src",x+i1+".jpg");
}
}
function tm2(x) { //функция, если картинки две
if(x.css("width")=="301px") {v=1;x.attr("src",s4);}
if(x.css("width")=="1px") {v=0;x.attr("src",s1);}
if(v==1) {i=0;i+=20;}
if(v==0) {i=0;i-=20;}
x.css("width",(parseInt(x.css("width"),10)-i)+"px").css("height","301px");
$("#test").html("x="+x.css("width"));
}
</script>
</body></html>
-------------------------------------------
Рабочий пример: http://kachay.ucoz.org/load/psevdo_3d_vrashhenie/27-1-0-387
|
| |
| |
Играйте бесплатно в 
