スマホページでスクロールすると現れるヘッダの作り方

Question

このページみたいにスクロールするとヘッダやバナーが上部に固定で表示されるようにする方法を教えてください。

https://item.rakuten.co.jp/SHOP-URL/ITEM-URL/?force-site=ipn

ヘッダはトップページに飛ぶリンクになっていればよく、参考ページのヘッダにあるメニューの表示は不要です。

Accepted Answer

ECマスターズの田中です。※RMSの、禁止タグを入力できるバグを利用する方法ですので、　今後、RMSの改修により、使用できなくなる可能性があります。最初に、ヘッダーとして表示させるためのHTMLファイルを、楽天GOLD内に設置してください。次に、下記の内容でCSSファイルを作成し、楽天GOLD内に設置してください。===== この下の行から ============ .spHeader {display: block;position: fixed;left: 0px;top: 0px;z-index: 2;width: 100%;height: HTMLの内容の高さpx;}#ipnsh-header, #rstTopSearch {position: relative;z-index: 3;background: white;}#topFuncShopPopup{z-index: 3;}===== この上の行まで ============※HTMLの内容の高さは、実際の数値にご変更ください。最後に、スマートフォン用共通説明文に下記のHTMLタグを貼り付けることで、スライドすると出てくる独自ヘッダーを設定することができます。===== この下の行から ================= この上の行まで ============※CSSファイルのURL・ヘッダー用ページのURLは、実際のURLにご変更ください。

スマホページでスクロールすると現れるヘッダの作り方

カテゴリーから探す