モバイル対応ディスプレイ

Question

私はモバイルレスポンスのウェブサイトを設計しています。私は複数の隠れたulを開くことができるユニークなコードを使用していますが、それらはすべて左にスクロールします。

問題はデスクトップまたはラップトップに表示されるため、スクロールバーが表示されます。新しいサイトであればスクロールすることがわかります。しかし、モバイルサイトでは、このスクロールバーが表示されないため、モバイルサイトのサイトを初めて利用している場合は、それらのアイテムがスクロールすることはわかりません。

コンテンツが800ピクセル幅になるまでコンテンツを隠す方法があるのだろうかと疑問に思っています。これは、人々が左にスクロールするようにテキストを表示します。または、スクロールバーに左または右のボタンが表示されるようにする方法がある場合でも、デスクトップ、ラップトップ、およびモバイル側をクリックまたはテープで左または右にスクロールします。

アドバイスをいただければ幸いです。

おかげ

Answer 1

あなたは、CSS @mediaタグで応答性の値を調整することができます。たとえば、あなたはこのように、通常のCSSクラスを使用している：max-width:800pxのためにお使いの携帯幅のためにそれを

.YourClass{ 
    display:block; 
} 

をそして、あなたはあなたの応答性の調整のためにそれを使用することができます。

@media only screen and (max-width: 800px){ 
    .YourClass{ 
     display:none; 
    } 
} 

をこの例では、ウィンドウの場合幅が800ピクセル未満の場合、ブラウザはそのクラスを使用して@media only screen and (max-width: 800px)に配置され、コンテンツを非表示にします。 800pxよりも高い場合は、通常のCSSクラスを使用してコンテンツを表示します。

thisリンクには、用途やさまざまな例があります。