Эффект "зависания" с помощью одного нажатия на iPad (аналогично SO) - PullRequest
1 голос
/ 19 июля 2011

Если вы когда-либо использовали StackOverflow на iPad, вы, возможно, заметили, что для удаления комментария вы:

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

На рабочем столе этот процесс более прост, поскольку мышь можетнаведите курсор на комментарий, скрыв и сделав значок видимым в mouseenter и mouseleave через jQuery .css.

Я уже настроил в своем блоге систему публикаций и комментариев, в которой эта функция очень похожачтобы SO работал на настольном компьютере, но мне интересно, как добиться функциональности iPad от SO.

Есть какие-нибудь идеи, как SO заставляет однократное нажатие действовать как наведение на комментарии?

Ответы [ 2 ]

1 голос
/ 19 июля 2011

используя jQuery, вы можете написать событие клика:

$(".comment").click(function(e){
    e.preventDefault();
    $(this).toggleClass("clicked");
});

И создайте CSS только для iPad , например:

.comment .delete
{
    display: none;
}

.comment.clicked .delete
{
    display: inline;
}

, который бы работал, если бы ваш html был примерно таким:

<div class="comment">... <a class="delete">Delete</a></div>

и соедините их в свои собственные файлы ipad.css и ipad.js и включите их в свои <head>

<!--[if iPad]>
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" />
<script type="text/javascript" src="ipad.js"></script>
<![endif]-->

рабочий пример: http://jsfiddle.net/hunter/pqLXS/

1 голос
/ 19 июля 2011

Каждый раз, когда я кодировал все, что реагирует на указание мыши в jQuery или Mootools, iPad немедленно преобразовывал это поведение в один клик. Это включает в себя ссылки, которые обычно ведут на другую страницу одним щелчком мыши. Разве это не то поведение, которое вы видите?

...