モバイル表示でのサイドバー

Simplicityの特徴 › フォーラム › Simplicityについての質問 › モバイル表示でのサイドバー

  • このトピックには2件の返信、1人の参加者があり、最後にpontaにより10年、 5ヶ月前に更新されました。
2件の返信スレッドを表示中
  • 投稿者
    投稿
    • #39044
      ponta
      ゲスト

      モバイル表示でのサイドバーの表示についてです。
      simplicityのデフォルトでは、モバイル表示でのサイドバーは表示されないと思うのですが、個別記事→関連記事の後にサイドバーを表示させることはできないでしょうか?
      よろしくお願いします。

    • #39046
      Hidekichi
      ゲスト

      単純にモバイルの時にdisplay:noneになってるだけなので表示すること自体は可能です。
      ただし追従スクロールは動作しないかと思います。これはセレクタ自体がモバイル時に取っ払われてサイドバーにまとまっているからかと思います。

      問題は画面幅のどこまでがスマホで、タブレットなのかというブレイクポイントです。

      だいたいモバイル表示と質問されるとスマホを想定されているかと思うんですが、基本スマホとタブレットがモバイル表示なので、PC以外はモバイル表示ということになります。しかしご存知のようにタブレットでもPC同様の解像度を持っているようなものもありますのでどこまで含めるかという感じになるわけです。

      スマホでもサイドバーを表示するということになると、ページ下部・あるいは上部にメニューとしてナビが出せる機能があります(スリックナビだったか名前は忘れましたが)が、これは使用しないのかするのかという点も考えないといけません。

      スマホでは上記機能を使うからタブレットでサイドバーということになると、スマホ以上の横幅が必要ですが、横向けにした時はどうする?などの問題も出てきます。
      これは例えばアンドロイドを利用しているかiphoneを利用しているかに限らず、デカイ画面のものと一般的なスマホサイズでは結構なサイズ差があるのでそこらをどうするかという点でもあります。

      メディアクエリには、ポートレートとランドスケープ、つまりは縦横向けそれぞれの設定もできますので細かく設定すればよいわけなんですけれども、細かくすればするほど汎用的な使い方ができなくなってきたりもします。

      ここで話は元に戻り、サイドバーはモバイルではdisplay:noneで非表示になっているだけです。つまりhtml内に情報としてあるわけです。なので、どういう条件の時にどこに表示させるかはjQuery・css等でどうとでもできます。問題はどういう条件かと言う点です。モバイルでは幅が広すぎるのでそこらの具体例が必要かと思います。

    • #39072
      ponta
      ゲスト

      Hidekichi様
      大変ご丁寧な回答ありがとうございます。
      表示はできるが、様々な条件を指定する必要があるということですね。
      そこまで私の知識では到底できませんので、カスタマイズで選択できる中から決めたいと思います。
      simplicityはデフォルトでも色々な選択肢を与えてくださっているのでありがたいです。
      この度はありがとうございました。

2件の返信スレッドを表示中
  • トピック「モバイル表示でのサイドバー」には新しい返信をつけることはできません。
スポンサーリンク
アドセンス(大)
アドセンス(大)