デスクトップユーザーのモーダルウィンドウで開きたいリンクがいくつかありますが、モバイルユーザーのモーダルウィンドウ（CSSクラスとjQueryイベントリスナーを介して開始されるモーダルウィンドウ）では開きません。このサイトはメディアクエリを使用してレスポンシブテーマを実行しているため、さまざまな画面サイズでさまざまな動作を処理する方法を理解しようとしています（各画面サイズで使用されているデバイスの種類を想定しています）。
私は今それを2つの異なるリンクで設定しています。画面サイズごとにこれらのリンクのうち1つだけが表示され、画面サイズが大きいほどモーダルウィンドウリンクが使用されると想定しています。メディアクエリが小さいサイズを返す場合、モーダルウィンドウリンクを非表示にして、目的のページへの標準リンクを表示します。
これを行うためのより良い方法があるに違いないようです。何か案は？
私の理解が正しければ、画面サイズに応じてさまざまなことを行うにはアンカーが必要です (モバイルを検出し、デスクトップの小さなウィンドウだけを回避する別の方法は、サイズとピクセル比に基づいてメディア クエリを実行することです)。
このアプローチで私が目にする問題は (両方のオプションがあり、css メディア クエリに基づいて正しいオプションを表示/非表示すると仮定すると)、コード内でコンテンツを繰り返していることであり、アクセシビリティにはあまり適していません。
jqueryでやってみませんか？ビューポートのサイズを検出し、リンクに適切な機能を与えることができます。たとえば、新しいアドレスにリダイレクトする以外に特定のアクションを持たないデフォルトのリンクがあるとします。ただし、ビューポートが x よりも大きい場合は、リンクのコンテンツを異なるものに記述します (モーダルを開くクラスを追加するなど)。