さまざまな画面サイズでタブイベントを変更するにはどうすればよいですか？

Question

デスクトップの場合、私は彼らがホバリング、モバイル、明らかにクリックイベントで行動するようにします。デスクトップ用

私はこれがあります。

$('#cards-tabs').tabs({ 
    event: 'mouseover' 
}); 

をしかし、私は携帯電話の画面になったら代わりにイベントevent: 'click'を適応させるために何ができるのでしょうか？

Answer 1

モバイルレイアウトが表示されると予想される場合は、javascriptで画面幅を確認し、それに基づいてイベントを変更できます。これはscreenWidthを取得するためのコードが表示されませんが、このアプローチの例は次のようになります。

$('#cards-tabs').tabs({ 
    event: (screenWidth <= 420 ? 'click' : 'mouseover') 
}); 

あるいは、別のオプションは、スタイルは、モバイル上で時にデスクトップタブを非表示にして、異なる示さなければならないことであろうすでにclickイベントが常にバインドされているタブ。

しかし、私は最初の解決策が良いと思います。