Пропорции для размеров фотографии.
На странице имеются маленькие фотографии, при клике на них, они открываются в диве в увеличенном размере, сохраняя пропорции в увеличенном виде. Все работает через element, но когда помещаю фото в массив не знаю, как обратиться к свойству img.
Вот код без массива, где все работает:
function aysNkaryBacirBacvoghPatuhanum(element){
document.getElementById("frizDivId").style.display = "block";
document.getElementById("bacvoghPatuhanId").style.display = "block";
var mecElement = document.getElementById("mecNkarId");
mecElement.src = element.src;
var x=window.innerHeight*0.9;
var y=window.innerWidth*0.8;
var a=element.height;
var b=element.width;
var c=x/a; arnelov
if(b*c > y){
c = y/b;
}
mecElement.width = b*c;
mecElement.height = a*c;
mecElement.style.marginLeft = "-" + b*c/2 + "px";
mecElement.style.marginTop = "-" + a*c/2 + "px";
}
</script>
</head>
<body>
<img src="img/1.jpg" style="width: 100px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this)">
<img src="img/2.jpg" style="width: 500px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this)">
<img src="img/3.jpg" style="width: 20px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this)">
<img src="img/4.jpg" style="width: 10px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this)">
<div style="display:none;" id="bacvoghPatuhanId" class="bacvogh-patuhan">
<div>
<img class="mec-nkar" id="mecNkarId" src="">
</div>
</div>
Тоже самое нужно реализовать в коде с массивом. var myFoto = ["1.jpg", "2.jpg", "3.jpg", "4.jpg"]; |
Wilshere,
aysNkaryBacirBacvoghPatuhanum(this, 0) function aysNkaryBacirBacvoghPatuhanum(element,num){ mecElement.src = myFoto[num] |
рони, правильно ли понял код?
var myFoto = ["1.jpg", "2.jpg", "3.jpg", "4.jpg"];
var nachalyiyIndex = 0;
for (var i=0; i<img.length; i++);
function aysNkaryBacirBacvoghPatuhanum(element, num){
document.getElementById("frizDivId").style.display = "block";
document.getElementById("bacvoghPatuhanId").style.display = "block";
var mecElement = document.getElementById("mecNkarId");
mecElement.src = myFoto[num]
}
var x=window.innerHeight*0.9;
var y=window.innerWidth*0.8;
var a=element.height;
var b=element.width;
var c=x/a; arnelov
if(b*c > y){
c = y/b;
}
mecElement.width = b*c;
mecElement.height = a*c;
mecElement.style.marginLeft = "-" + b*c/2 + "px";
mecElement.style.marginTop = "-" + a*c/2 + "px";
}
</script>
</head>
<body>
<img src="img/1.jpg" style="width: 100px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this, 0)">
<img src="img/2.jpg" style="width: 500px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this, 0)">
<img src="img/3.jpg" style="width: 20px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this, 0)">
<img src="img/4.jpg" style="width: 10px; height:100px;" onclick="aysNkaryBacirBacvoghPatuhanum(this, 0)">
<div style="display:none;" id="bacvoghPatuhanId" class="bacvogh-patuhan">
<div>
<img class="mec-nkar" id="mecNkarId" src="">
</div>
</div>
Но так картинка опять растягивается. |
Цитата:
Цитата:
|
Цитата:
|
Цитата:
|
| Часовой пояс GMT +3, время: 04:35. |