2011-08-22 12 views

答えて

1

現在、タッチイベントはサポートされていません。

+0

下の私の答えを参照してください.... – TheBlackBenzKid

+6

@ TheBlackBenzKid - あなたの答えがupvoteを取得した場合、それは "下"以上になりません。そして、他の人が答えを加えたら、それはさらに混乱するでしょう。これはフォーラムではないことを覚えておいてください。あなたの完全な答えを構成します。コメントがある場合は、自己完結型でなければなりません。あなたが答えに同意しない場合、うーん、それはdownvoteオプションがある理由です。 – ctacke

+0

上記の男が言った.... .... D –

-2

これは部分的に真実ではありません。私はWindows Phone 7で開発しました。私はタッチ効果を達成しました。

http://jsfiddle.net/blackdynamo/yxhzU/

ここで、これはHTC HD7に動作します - モバイル版とデスクトップ版を選択します。以下のコードを見ることができます:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title>jQuery Mobile Carousel Demo - jsFiddle demo by blackdynamo</title> 
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js' jquery.mobile, carousel></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.js"></script> 
    <link rel="stylesheet" type="text/css" href="/css/normalize.css"> 
    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 
    <script type='text/javascript' src="https://github.com/blackdynamo/jQuery-Mobile-Carousel/raw/master/jquery.ui.ipad.js"></script> 
    <script type='text/javascript' src="https://github.com/blackdynamo/jQuery-Mobile-Carousel/raw/master/jquery.mobile.carousel.js"></script> 
    <style type='text/css'></style> 
    <script type='text/javascript'> 
    //<![CDATA[ 
    $(window).load(function(){ 
     (function($) { 
     $("#carousel1").carousel(); 
     $("#carousel2").carousel({direction: "vertical"}); 
    })(jQuery); 
    }); 
    //]]> 
    </script> 
    </head> 
    <body> 
Horizontal 
<div style="height: 300px; width: 500px"> 
    <ul id="carousel1" style="display: none;"> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#381;">Page 1</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#837;">Page 2</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#999;">Page 3</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#738;">Page 4</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#142;">Page 5</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#927;">Page 6</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#987;">Page 7</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#187;">Page 8</div> 
     </li> 
    </ul> 
    </div> 
Vertical 
<div style="height: 300px; width: 500px"> 
    <ul id="carousel2" style="display: none;"> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#381;">Page 1</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#837;">Page 2</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#999;">Page 3</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#738;">Page 4</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#142;">Page 5</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#927;">Page 6</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#987;">Page 7</div> 
     </li> 
    <li> 
     <div style="width: 100%; height: 100%; background-color:#187;">Page 8</div> 
     </li> 
    </ul> 
    </div> 
</body> 
</html> 
+2

この回答は何を意味しますか? "これは真実ではない"答えではない - おそらくコメントです。このリンクは、HTMLとJSを含むページに移動するだけです。そして、それほど多くはありません。そのHTMLがタッチイベントの働きを示す回答であれば、* HTML *を回答として投稿してください。実際に電話で作業していることは何も表示されていないリンクされたページに私たちを送信しないでください。 – ctacke

+0

私のCSSは無視します。 – TheBlackBenzKid

+1

質問はタッチイベントのWebBrowsersコントロールについてです。 javascriptでマウスのイベントでそれらを模倣するのは異なっています。 –

5

現在、タッチイベントはサポートされていません。

document.ontouchstart = function() { alert("TS"); } 
document.ontouchmove = function() { alert("TM"); } 
document.ontouchend = function() { alert("TE"); } 

これらのどれもIE9モバイルでは起動しません。

関連する問題