Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.10.2019, 21:37
Новичок на форуме
Отправить личное сообщение для tinycolonel Посмотреть профиль Найти все сообщения от tinycolonel
 
Регистрация: 14.10.2019
Сообщений: 6

onmouseover В javascript
у меня есть задание:
У нас есть кнопка и скрытый абзац с изображением.
После определения функции showImage () добавьте следующий код:

Объявите новую переменную myImage для хранения элемента «img» (вам решать, как получить доступ к этому элементу).
Определите функцию getBigger (). Эта функция должна изменить свойства стиля «ширина» и «высота» элемента myImage с «100px» на «200px». Используйте style.width и style.height, чтобы сделать это.
Определите функцию getSmaller (). Эта функция должна изменить стиль «ширина» и свойства «высота» элемента myImage обратно с «200px» на «100px». Используйте style.width и style.height, чтобы сделать это.
Установите атрибут события onmouseover в myImage. Вызовите функцию getBigger для этого события.
Установите атрибут события onmouseout в myImage. Вызовите функцию getSmaller для этого события.
Нажмите кнопку, чтобы отобразить изображение, а затем наведите на него указатель мыши, затем выйдите из изображения. Размер бургера изменится.
Мой код:
<!DOCTYPE html>
<head>

</head>
<body>
<p>
<button onclick="showImage()">Push me!</button>
</p>
<br>
<p class="hiding" style="color: navy; display: none"> Yes, it's me again!
<br>
<img src="http://ipic.su/img/img7/fs/burger.1537205489.jpg" style="width:'100px'; height:'100px'">
</p>
<script type="text/javascript">
hidingImage = document.getElementsByClassName("hiding")[0];
function showImage(){
if (hidingImage.style.display == "none"){
hidingImage.style.display = "block";
} else {
hidingImage.style.display = "none";
}
}
var myImage = document.getElementsByTagName("img")[0];
function getBigger(){
myImage.style.width = "200p";
myImage.style.height = "200px";
}
function getSmaller(){
myImage.style.width = "100px";
myImage.style.height = "100px";
}
document.getElementsByTagName("img")[0].onmouseover = getBigger;
document.getElementsByTagName("img")[0].onmouseout = getSmaller;
</script>
</body>
</html>

Помогите найти ошибку.

Последний раз редактировалось tinycolonel, 16.10.2019 в 19:37.
Ответить с цитированием
  #2 (permalink)  
Старый 15.10.2019, 22:24
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 27,101

Сообщение от tinycolonel
getElementsByTagName
это коллекция элементов, укажите какой конкретно вам нужен!!!
Ответить с цитированием
  #3 (permalink)  
Старый 16.10.2019, 19:18
Новичок на форуме
Отправить личное сообщение для tinycolonel Посмотреть профиль Найти все сообщения от tinycolonel
 
Регистрация: 14.10.2019
Сообщений: 6

Когда первый раз наводишь курсор на указатель, то всё работает, но если наводить дальше то увеличится только высота

Последний раз редактировалось tinycolonel, 16.10.2019 в 19:20.
Ответить с цитированием
  #4 (permalink)  
Старый 16.10.2019, 19:27
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 27,101

tinycolonel,
код отформатируйте в 1 посте.
кнопка <>
Ответить с цитированием
  #5 (permalink)  
Старый 16.10.2019, 19:38
Новичок на форуме
Отправить личное сообщение для tinycolonel Посмотреть профиль Найти все сообщения от tinycolonel
 
Регистрация: 14.10.2019
Сообщений: 6

Отформатировал
Ответить с цитированием
  #6 (permalink)  
Старый 16.10.2019, 19:38
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 27,101

Сообщение от tinycolonel
то увеличится только высота
значит в ширине есть ошибка!!! строка номер ... тут вы никак не отформатируите код, что не позволяет указать точнее.
Ответить с цитированием
  #7 (permalink)  
Старый 16.10.2019, 19:39
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 27,101

tinycolonel,
строка 25 напишите единицы измерения корректно.
Ответить с цитированием
  #8 (permalink)  
Старый 16.10.2019, 19:41
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 27,101

tinycolonel,
на всякий случай лучше mouseenter/leave использовать, чем mouseover/out

https://learn.javascript.ru/mousemov...ter-mouseleave
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Интерпретатор Java на JS kobezzza Оффтопик 24 11.10.2012 18:32
javascript + onmouseout и onmouseover Лена Фриман Общие вопросы Javascript 0 17.09.2012 11:12
Первый Moscow JavaScript Meetup korenyushkin Общие вопросы Javascript 0 26.07.2011 15:23
Последние книги по JavaScript! monolithed Учебные материалы 7 26.10.2010 19:40
Выдвет ошибку JavaScript Ромио Opera, Safari и др. 4 21.10.2010 20:34