Никакой реакции от моих кнопок HTML в phonegap - PullRequest
4 голосов
/ 05 мая 2011

У меня есть три кнопки HTML, и когда я нажимаю на них, нет внешнего свечения, и они ничего не делают.

Я также пытался их стилизовать, но они остались с дизайном по умолчанию. Я только что использовал обычный код, я просто понятия не имею, что с ними не так

<input type="button" value="Proceed">
<input type="button" value="Cancel">

Ответы [ 2 ]

4 голосов
/ 05 мая 2011

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

Ваша "кнопка":

<a class="button" id="yourButton">Button</a>

Некоторые очень простые CSS дляпереключать фон и цвет текста на ощупь:

a.button {
    color:#fff;
    border:0px;
    padding:5px;
    background:#000;
}

a.button-active {
    background:#fff;
    color:#000;
}

А вот и JavaScript, который вы бы вызвали в своей загрузке на обработчике устройства.Я использую xuijs здесь (xuijs.com), но вы можете использовать jQuery или любой другой javascript для добавления и удаления классов:

x$('.button').on('touchstart', function(e) { 
    x$(e.currentTarget).addClass('button-active'); 
} );
x$('.button').on('touchend', function(e) { 
    x$(e.currentTarget).removeClass('button-active'); 
} );

Это очень простой пример.После того, как вы настроите все это, вы можете внести любые изменения в CSS, чтобы определить, как будет выглядеть кнопка, когда она активна и неактивна.

0 голосов
/ 05 мая 2011

Хммм .. Ваш вопрос не так ясен. Но если вам нужно только свечение кнопок, вы можете посмотреть, как это делает Formalize .

Вот страница , показывающая эффект свечения кнопки (при нажатии).

Обновление: Ой, простите, пропустил часть "PhoneGap". Решение, которое я дал выше, предназначено только для обычных HTML-форм, у меня пока нет опыта использования phonegap. веселит. :)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...