問題タブ [adaptive-design]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
php - 異なるバージョンの Web サイトを分離する
サイトのさまざまなバージョンに合わせて、サイトを最適化し、維持しやすいようにしたいと考えています。
私は自分のサイトのいくつかのバージョンを持っています:
- iphone/ipod/android など...
- iPad/タブレットなど...
- 古い拍手電話のような他の小さなデバイス
- デフォルト
MySQL 5、PHP 5、およびApache + Memcacheでubuntuサーバーを使用しています。
すべてのサイトが同じ基本機能を使用するようにサイトを実装する最良の方法は次のとおりです。
- PHP
- JS（共通用）
- CSS（共通用）
- 等...？
ありがとう
responsive-design - レスポンシブデザインとアダプティブデザイン
RWD（レスポンシブウェブデザイン）とAWD（アダプティブウェブデザイン）の違いを簡単に説明していただけますか？
html - レスポンシブデザインの表示プロパティで「table」と「table-cell」を使用していますか？
display: table;コンテナとdisplay: table-cell;子要素で、ページ上でいくつかの投稿を水平方向に強調表示するために使用しています。
問題は、それらをどのように応答させるかについてはわかりません。つまり、画面サイズが小さくなるにつれて、各子（つまりtable-cell）は、水平方向に整列したまま、比例して小さくなるはずです。
どうすればよいですか？
responsive-design - TYPO3とアダプティブ画像-画像のサイズ変更は機能しません
私は以下を使用してレスポンシブデザインのウェブサイトを作成しようとしています：
- TYPO3
- 財団の枠組み
- 拡張adx_adaptive_images
TYPO3とはfoundation frameworkかなりクールに動作しますが、adaptive images画像のサイズはまったく変更されません。
以前はhttp://adaptive-images.com/で試しましたが、同じ問題が発生します。
デフォルトの.htaccessファイルを使用します
助言がありますか？
css - 設計におけるレスポンシブまたはアダプティブ CSS の使用
ある友人から、レスポンシブ CSS 設計について聞いたことがあります。その利点は、さまざまな解像度の Web サイトを作成する必要がないことです。単一の CSS を作成するだけでうまくいくと彼は言いました。今日、私はインターネットでレスポンシブデザインを検索し、デモを示した記事に出くわしましたが、@mediaウェブサイトでサポートしたい解像度を提供する必要があると書かれており、サンプルページで試してみました。@media query for (max-width:980px)モバイルでは問題なく動作しますが、ラップトップでは動作しません
。
@media query上記の方法では、複数のブラウザーで有効にするために同じ css の異なるバージョンを作成する必要があるため、シングルが利用可能なすべての解像度で機能するように微調整する方法を教えてください。
javascript - モバイル デバイスに基づいてリンクを変更する
静的 HTML リンクを含む HTML img タグがあります。
私の考えは、ユーザーが接続しているデバイスのタイプに基づいて、そのリンク (画像ではなく) を動的に変更することです。私が関心を持っているデバイスの主な種類は、PC、Google/Andriod、Ios、Amazon/Andriod です。
これに対する HTML/CSS/Javascript ソリューションはありますか、それとも php/dom/server 側が唯一のオプションですか?
themes - カラーボックスの iFrame をアダプティブにすることはできますか?
Drupal 7.22 でアダプティブ テーマを作成しましたが、これは非常にうまく機能します。残念ながら、Colorbox によって開かれた iFrame のサイズは適応型ではありません。
それらを開くには、次のようにします。
ただし、幅と高さのプロパティはハードコーディングされています。ブラウザーのアパーチャ/画面の定義に基づいて、幅と高さのプロパティに異なる値を指定するにはどうすればよいですか?
たとえば、幅が 0 ～ 1024px のすべての画面には、次のプロパティを持つカラーボックス iFrame が必要です。
また、解像度が 1024px を超えるすべての画面にはcolorbox、次のプロパティを持つ iFrame が必要です。
これらを適応させる方法について何か提案はありますか?
viewport - ビューポート メタ タグを使用して、固定幅のレイアウトをさまざまな画面幅に合わせて拡大縮小するにはどうすればよいですか
固定幅のレガシー サイトに取り組んでおり、いくつかのアダプティブ レイアウトを実装することで、タブレット ユーザーにより最適なエクスペリエンスを作成したいと考えています。最初のレイアウトは幅 600 ピクセルのデザインで、画面幅が 600 ピクセルから 768 ピクセルのデバイスに表示されます。2 つ目のアダプティブ レイアウトは幅 769 ピクセルのデザインで、画面幅が 769 ～ 1023 のデバイスで表示されます。
ビューポート メタ タグを使用して、元のデザインより幅が広いモバイル ブラウザーに合わせてデザインを拡大する方法を知りたいです。
たとえば、ブラウザの画面幅が 768px のデバイスで 600px のデザインを表示する場合、小さいデザインを画面の幅いっぱいに表示するにはどうすればよいですか?
流動グリッドを使用した Web サイトのアダプティブ レイアウトに関する多くの情報を見つけましたが、固定幅サイトのデザイン幅とビューポート サイズの関係について具体的に述べているものはありません - 少なくとも私が理解できるものはありません。