css - モバイル デバイスの Nivo スライダー キャプションを非表示にする

Question

こんにちは、誰かが私を助けてくれるかどうか疑問に思っていました。現時点では、Nivo キャプションを表示するように設定された Nivo Slider があります。特定の画面サイズで。一部の人々にとっては、iPhone のように見え、キャプションが表示され、更新されるまで右側に空白が作成される (現在のサイズには大きすぎる) ことに気付きました。モバイルの要素を「取り除く」より良い方法はありますか?

ありがとう。アル。

Answer 1

CSS ルールを上書きしています。

スタイルシートのある時点で、次のものがあります。

.theme-light .nivo-caption {
    display: none;
}

もう少し：

.nivo-caption {
    -moz-box-sizing: border-box;
    background: none repeat scroll 0 0 #000000;
    bottom: 10%;
    color: #FFFFFF;
    display: block;
    height: 66px;
    left: 0;
    opacity: 0.9;
    overflow: hidden;
    padding: 5px 10px;
    position: absolute;
    width: 440px;
    z-index: 8;
}

表示: なし;

その後

表示ブロック;

画面サイズに基づいて、またはそれがスマートフォン（modernizr）であるかどうかを検出することでさえ、キャプションを取り除くためにjQueryアプローチを使用します。