Как я могу увеличить изображение на javascript-событии, когда его размер задан с помощью css?

Вопрос:

У меня есть CSS (ниже), определяющий размер изображений

#latestImages img
{
height: 95px;
width: auto;
}

Это влияет на эти изображения:

<img src="@images.ImagePath" alt="@images.NameOfImage" />

Когда я устанавливаю событие onmouseover на это изображение следующим образом:

<img src="@images.ImagePath" alt="@images.NameOfImage" onmouseover="this.width=100;this.height=100;" onmouseout="this.width=200;this.height=200;"/>

Высота и ширина изображения изменяются в html при просмотре источника, но видимых изменений нет, но когда я удалил css, изменения произошли. Кто-нибудь знает, почему это? И есть ли что-нибудь, что я могу сделать по-другому, чтобы сохранить css как есть и увеличить javascript изображение? Заранее спасибо!

Лучший ответ:

Этот формат можно использовать в обработчике this.style.width="50px": this.style.width="50px". Или еще лучше, не помещайте JS в свой HTML и не записывайте функцию для того, что вы пытаетесь сделать.

Ответ №1
onmouseover="this.style.width='100px';this.style.height='100px';"
onmouseout="this.style.width='200px';this.style.height='200px';"

Стили нуждаются в единицах. В этом случае px. В противном случае это может быть pt, in или em.

Оцените статью
TechArks.Ru
Добавить комментарий