Форум

Wilshere · #1 (**permalink**) 07.03.2016, 12:44

Имеется картинка, при клике должен изменяться размер.
Нужно использовать window.innerHeight и window.innerWidth. Не понимаю, как прописывать им значения.

<img width="250" height="250" id="art11" src="img/mek.jpg" class="art11" onclick="BigPic()">

var img1 = document.getElementById("art11");
				
	function BigPic() {
			
}

При клике на картинку изображение должно стать на 90% от window

рони · #2 (**permalink**) 07.03.2016, 14:12

Wilshere,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style>
     img.big{
         height:   90%;
         width: 90%;
      }


    </style>
</head>

<body>
<img  id="art11" width="250" height="250" src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" class="art11" onclick="this.classList.toggle('big')">
</body>


</html>

Wilshere · #3 (**permalink**) 07.03.2016, 14:26

рони, спасибо за помощь, но мне нужно реализовать задачу через функцию с window.innerHeight или window.innerWidth.

Cuntmann · #4 (**permalink**) 07.03.2016, 14:36

<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>XZ</title>
<script>
/* Скрипт срабатывает после загрузки страницы */
onload=function(){
/* Коллекция всех элементов с классом art11 */
var img=document.querySelectorAll('[class="art11"]');
/* Назначаем каждому элементу коллекции какие-то действия при клике на нем */
for(var i=0; i < img.length; i++){
img[i].onclick=function(){
var W=(window.innerWidth*0.9).toFixed(),
    H=(window.innerHeight*0.9).toFixed();
	this.width=W;
	this.height=H;
	this.title='width="'+W+'" height="'+H+'"';
}
}
}
</script>
</head>
<body>
<center>
<img width="250" height="250" class="art11" src="img/slide1.jpg" title="1-е фото" />
<img width="250" height="250" class="art11" src="img/slide2.jpg" title="2-е фото" />
<img width="250" height="250" class="art11" src="img/slide3.jpg" title="3-е фото" />
</center>
</body>
</html>

Cuntmann · #5 (**permalink**) 07.03.2016, 14:38

рони,
зато я run не забыл на этот раз

Wilshere · #6 (**permalink**) 08.03.2016, 21:39

Cuntmann, выручили.
Кстати, а что дает toFixed()?

Cuntmann · #7 (**permalink**) 09.03.2016, 23:24

JavaScript toFixed() Method

Форум

Справочник

Discord чат

Курсы javascript