VWSとは フォーラム Lightning [ 解決済 ] Lightning でスマホとパソコンの表示切り替えについて

このトピックには2件の返信が含まれ、2人の参加者がいます。4 週間前 yunahana さんが最後の更新を行いました。

3件の投稿を表示中 - 1 - 3件目 (全3件中)
  • 投稿者
    投稿
  • #13242

    yunahana
    参加者

    トップページのヘッダー画像は、パソコンとモバイル用画像の設定ができますが、通常の固定ページでの長い文章を、スマホでは短くして表示させたいと思っています。
    画像もスマホでは小さい画像にしたいと考えています。

    スマホのみ表示、パソコンのみ表示など、Lightningにも、そのような機能がありますでしょうか?
    また、何か方法がありましたらご教授頂けると助かります。

    どうぞよろしくお願いいたします。

    当サイト環境
    ・BizVektor・Lightningのバージョン:Lightningバージョン: 5.1.2
    ・Lightning Child Sampleバージョン: 0.1.2
    ・選択しているデザインの種類:Lightning-FortかLightning-Pro
    ・拡張デザインスキンであればバージョン:こちらはよく分かりません。

    #13258

    Vektor,Inc
    キーマスター

    Lightning は Bootstrap3 というCSSフレームワークを利用していますので、Bootstrapのclassを追加する事で端末サイズに応じた表示切り替えは可能です。

    <div class="visible-xs-block">スマホのみ</div>

    使えるclass名は下記を参照してください。
    https://getbootstrap.com/docs/3.3/css/#responsive-utilities

    ただし、これは現在のBootstrapよりも前の記述方法なので、Lightning が Bootstrap4などに切り替えたときに修正が必要になる可能性がありますので、心の片隅に覚えておいてください。

    #13267

    yunahana
    参加者

    Vektor,Inc 様

    ご教授、本当にありがとうございます。
    参考URLもありがとうございました!
    Lightning が Bootstrap4などに切り替えになった時を見逃したり、ど忘れしたりするのが怖いですが、
    この機能はとても必要なので、助かりました。

    本当にありがとうございました!

    追伸
    スマホ、パソコンと切り替え出来る機能が増えたLightningを心待ちにしたいと思います。

3件の投稿を表示中 - 1 - 3件目 (全3件中)

このトピックに返信するにはログインが必要です。