2016-06-21 2 views
0

Я хочу, чтобы изображение «превратилось» в другое изображение при паре. Итак, в основном на странице есть изображение (image1.png), и при его зависании он должен просто показать другое представление (image2.png) вместо первого. Я попытался использовать это, и это работает прекрасно:Mouseover для смарт-устройств

<img src='Image1.png' width='100' height='100' 
onmouseover="this.src='Image2.png';" 
onmouseout="this.src='Image1.png';" /> 

Ни одно из изображений не имеют ссылок, поэтому я не использовал какие-либо из решений «зависания».

Однако теперь я понял, что он будет работать только на компьютерах, а не на смарт-устройствах, поскольку на самом деле они не имеют функции наведения. Но поскольку на веб-сайте есть довольно много пользователей смарт-устройств, очень важно, чтобы он работал и на них.

Есть ли какое-то решение?

Мои навыки JS очень ограничены, поэтому я еще не смог понять это.

Заранее благодарим за любую помощь!

+0

Посмотрите на это: http://stackoverflow.com/questions/2851663/how-do-i-simulate-a-hover-with-a-touch-in-touch- enabled-browsers И это тоже: http: //www.hnldesign.nl/work/code/mouseover-hover-on-touch-devices-using-jquery/ – Archish

ответ

0

Мой личный опыт, его лучше использовать CSS для этих типов вещей, и вы не можете указать абсолютный путь в CSS нет необходимости ссылок для изображений (../../.)

Опять же, вы не можете иметь наведите указатель мыши на мобильные устройства, но вы можете изменить наведение на сенсорный клик. В настоящее время обсуждается здесь: Changing :hover to touch/click for mobile devices

Смежные вопросы