カテゴリー:
キーワード検索フォーム
閲覧数:629 配信日:2015-12-27 21:43
Yahoo
トップページ以外には検索フォーム未設置
・トップページにはキーワード検索フォームを最初から表示
・ボタンクリックでフォーム送信
※ドロワーメニュー内に、キーワード検索フォーム設置なし
ユニクロ
グローバルメニューに商品検索ボタンあり
<div class="uni-search-form-trigger uni-highlight" search-focus="" analytics-on="click" analytics-event="click" analytics-label="H_search" analytics-category="Common Header">
<span class="uni-search-form-trigger-text ng-binding">商品検索</span>
</div>
・クリックすると検索アイコンが消え、検索フォームを表示
・その際、ドロワーメニューが×印に切り替わるようになっている
※画面一番上には、タイトルロゴ、検索フォーム、ドロワーアイコン(×印)のみが表示される
・Enterキー押下でフォーム送信(送信ボタン未設置。入力欄に初期値として表示されるplaceholder属性指定なし)
※ドロワーメニュー内に、検索フォーム設置なし
ドロワーアイコン×印
・2つの役割
A.ドロワーアイコンをクリックした場合
・ドロワーメニューがオープン
・ドロワーアイコンは×印へ切り替わる
・×印をクリックすると、開いているドロワーメニューが閉じる
B.検索アイコンをクリックした場合
・検索アイコンが消え、検索フォームを表示
・ドロワーアイコンは×印へ切り替わる
※画面一番上には、タイトルロゴ、検索フォーム、ドロワーアイコン(×印)のみが表示される
・×印をクリックすると、表示されていた検索フォームが消え、元の検索アイコンへ戻る