iPadのモバイルSafariのHTML5テンプレート。iScrollを使用したDivは正常に機能しています。また、if/elseステートメントにjQuery関数が含まれています。この関数は、ユーザーがiScroll divの外側をタップしているかどうかをテストし、タップしている場合は、iScrolldivをフェードします。
問題は、if / elseステートメントは、ユーザーがページの2番目のdivの外側をタップしている場合のテストとしては正常に機能しますが、ユーザーがiScrolldivの外側をタップしている場合のテストとしては機能しません。理由がわかりません。if/elseステートメントでiScrolldivに関連付けられているすべてのdivIDを試しましたが、うまくいきません。
以下の機能:
var articleBodyEl = document.getElementById('content');
articleBodyEl.addEventListener("touchend", function() {
var $target = $(event.target);
if ($target.is('ul#article_images') || $target.is('ul#article_images li') || $target.is('div#article')) {
//do nothing
} else {
$('#article').fadeToggle('fast');
}
});
#article = iScroll div
#article_images =ページ上の個別のdiv、ユーザーがこのdivの外側をクリックしているかどうかをテストします。
HTML:
<div id="article">
<div id="article_content">
<div id="scroller">
<div id="text_1" class="article_text">
<h4>Wish you were here</h4>
<p>Sometimes we stumble upon a photograph that requires no words whatsoever. An image that proves the ancient adage that a good picture is worth a thousand words (and probably more, if some of them are small words like ‘if’, ‘it’ and ‘er’). </p>
</div>
</div>
</div>
</div>