0

この機能でモバイルとデスクトップに取り組もうとしています。ホバーに使用しているこのスクリプトを取得しor、Modernizr の演算子を追加して、タッチ機能を検出するかどうかを確認し、そうでない場合はホバーを使用する方法はありますか? 誰かが私のためにこれを明確にするのを手伝ってくれることを願っています.

$(function() {
        $('ul.recent-widget li').hover(function(){
            $(this).find('img').animate({top:'182px'},{duration:500});
        }, function(){
            $(this).find('img').animate({top:'0px'},{duration:500});
        });
    });

デスクトップで作業している場合の例を次に示しますhttp://jsfiddle.net/chris_s/dcq2F

4

1 に答える 1

1

Modernizr を使用すると、上記のコメントで推測したように、条件を設定することができます。これは、いずれかの関数のみを実行します。

if ( Modernizr.touch ) {
   // click or bind to touchstart, touchmove, etc
} else {
   // hover (like your animation example)
}

パフォーマンスに関しては、デフォルトの css トランジションまたはアニメーションの使用を検討して!Modernizr.csstransitionsから、たとえば、そのホバー機能で を活用することもできます。

もちろん、モバイルは常に変化するターゲットであるため 、どのソリューションにも 注意点があります。おそらく、いくつかの基準 (画面サイズ、機能検出、ポリフィルなど) を組み合わせてテストし、状況に最適なものを選択してください。

于 2012-11-08T09:54:09.210 に答える