Как симулировать сенсорные события для мобильных браузеров? Android, iPhone? - PullRequest
4 голосов
/ 24 января 2012

Я создаю веб-приложение. Я тестировал его в мобильном браузере и заметил, что: активный псевдокласс dsnt действительно работает. Как мне симулировать клики для мобильного браузера? Я использую CSS спрайты. Я наткнулся на ontouchstart, но не знаю, как это использовать. кто-нибудь может мне помочь над этим? Заранее спасибо.

1 Ответ

4 голосов
/ 24 января 2012

Совершенно верно, ontouchstart поможет вам чего-то достичь - от изменения CSS до возможности перетаскивать элементы на сенсорных устройствах, поддерживающих сенсорные события. И вы используете jQuery, который позволит вам связать эти события с вашими элементами.

Я написал статью на PHPAlchemist.com , в которой подробно описываются необходимые шаги по созданию настраиваемой полосы прокрутки с интеграцией сенсорных событий для мобильных устройств, но это может быть несколько далеко идущим. По сути, вы хотели бы сделать что-то вроде этого (код JQuery Javascript):

// get your button...
var my_button = $(".my_button_class");

// first, bind the touch start event to your button to activate some new style...
my_button.bind("touchstart", function() {
    $(this).addClass("button_active");
});

// next, bind the touch end event to the button to deactivate the added style...
my_button.bind("touchend", function() {
    $(this).removeClass("button_active");
});

... тогда в вашем CSS вы можете получить что-то вроде этого, например:

.my_button_class
{
    background-image: url(image.png);
    background-position: 0px 0px;
}

.button_active
{
    background-position: 0px -20px;
}

В двух словах, вы добавляете класс к своей кнопке при запуске касания и удаляете его, когда касание заканчивается, и CSS будет контролировать то, как он выглядит. Надеюсь это поможет! :)

...