どうか教えて下さい！
| > フロント機能 > スマホの右側からスライドして表示されるスペースに表示させるには |
フロント機能
 |
| スレッド表示 | 新しいものから | 前のトピック | 次のトピック | 下へ |
| 投稿者 | スレッド |
|---|---|
| ytk |
投稿日時: 2016/11/27 14:29
対応状況: −−−
|
仙人   登録日: 2009/12/7 居住地: 投稿: 349 |
スマホの右側からスライドして表示されるスペースに表示させるには 現在、ヘッドにメニューブロックを追加してPCのみ表示させるように設定をしました。
<div class="pc"> で、スマホでは右上のカテゴリを開くボタンを押したときに右側から出てくるスペースに表示させたいのですがどのように記載したら宜しいでしょうか。 何卒、宜しくお願い致します。
|
| umebius |
投稿日時: 2016/11/27 16:08
対応状況: −−−
|
神   登録日: 2016/7/22 居住地: 投稿: 2085 |
Re: スマホの右側からスライドして表示されるスペースに表示させるには 右上のカテゴリを開くボタンというとハンバーガーメニューですかね？
jacascriptによって、drawer_blockというクラスがついたパートを#drawerの中に放り込む仕様になっています。 以下のテンプレートを参考にされると良いと思います。 Block/category.twig Block/login.twig Block/search_product.twig
|
| ytk |
投稿日時: 2016/12/3 8:01
対応状況: −−−
|
仙人 登録日: 2009/12/7 居住地: 投稿: 349 |
Re: スマホの右側からスライドして表示されるスペースに表示させるには ありがとうございます。ハンバーガーメニューの中に入りました！
中に入ったのですがレイアウトが崩れているのですがPCに影響をさせずにハンバーガーメニュー箇所だけのCSSを整える事が可能でしょうか。 ご教授頂けると幸いです。 具体的にはPCでは横一列にカテゴリの文字がヘッダーに並んでいるのを ハンバーガーメニューでは縦一列にしたいです
|
| umebius |
投稿日時: 2016/12/3 16:45
対応状況: −−−
|
神 登録日: 2016/7/22 居住地: 投稿: 2085 |
Re: スマホの右側からスライドして表示されるスペースに表示させるには 検索ブロックのCSS見るとこんな風に書かれてると思います！
スクリーンの幅を指定するメディアクエリと.drawer 内の指定で大丈夫ではないでしょうか？ 参考にしてみてください！ @media only screen and (max-width: 767px) { ... .drawer .search_inner { padding: 0 10px; } .drawer .search_inner select, .drawer .search_inner input, .drawer .search_inner button { margin-bottom: 10px; } ... }
|
| スレッド表示 | 新しいものから | 前のトピック | 次のトピック | トップ |
