質問: 楽天スマホページの商品検索窓の見せ方について 楽天スマホページの商品検索窓の見せ方について、下記のお店のように、ページを下にスワイプしたときだけ検索窓を出現させる方法を教えていただきたいです。http://item.rakuten.co.jp/e-goods/c/0000000446/現在私のお店でも、上記サイトのようなフローティングのヘッダーがすでにあり、その下に検索窓を表示させたり隠したりしたいです。
回答: ecマスターズの田中です。既存のフローティングヘッダー含め、楽天rmsの、禁止タグを入力できるバグを利用する方法ですので、今後、rmsの改修により、使用できなくなる可能性があります。jqueryにより画面のスクロールを検知し、スクロール後の画面位置がスクロール前より下なら表示、上なら非表示にする、という処理を行うよう設定することで実現することが可能です。最初に、下記内容で外部jsファイルを作成し、楽天gold内に保存してください。===== この下の行から ================jquery(function($){var _now = 0;var _flgs = true;var _target = ""; //表示・隠す部分のセレクター$(window).scroll(function () { var _scr = $(window).scrolltop(); if (!_flgs) { if (_scr < _now) { $(_target).show(); _flgs = true; } } else { if (_scr > _now) { $(_target).hide(); _flgs = false; } } _now = _scr; });});===== この上の行まで ================「表示・隠す部分のセレクター」の部分ですが、スタイルシートを適用させる時と同じ書式で、検索窓の部分を特定できる文字列を指定してください。たとえば、検索窓の部分が と で囲まれている場合は、var _target = "#searchform";という具合になります。楽天gold内への保存ができましたら、下記htmlタグを共通説明文に挿入することで、検索窓を表示させたり隠したりする設定ができます。===== この下の行から ===================== この上の行まで ================