研究日誌 - 1380461699 - したらば掲示板

研究日誌

200：名無しさん：2014/05/02(金) 07:44:56: 【共通】上部の固定

先日、テンキーのHTML画面のBASIC!のテストプログラムの話を
しましたがテンキーだけ画面に出すのは使いづらいと
思い始めました。

そこでテンキーは、ページ上部で固定で常に表示して、下部
には、スクロール可能な一覧画面を表示する方法をさがして
みたら、ありました。

【[CSS]ヘッダは上部固定で、フッタはコンテンツが少なくても最下部にするスタイルシート、レスポンシブにも対応！】
http://coliss.com/articles/build-websites/operation/css/sticky-footer-navbar-by-bootstrap.html

このページで紹介しているサンプルはヘッダーとフッターを
両方とも固定するでした。

私の場合、ページ下部は一覧画面にしたいので、フッターの
固定は不要だったのでその部分をまず削除しました。

必要最低限を削除したのでまだ不要箇所があるかもしれませんが
とりあえず、フッターは、消えました。

さらにヘッダー部分にテンキーを組み込み。

あまりテンキーの高さがあると横持した場合に、下部の一覧用
フィールドが狭くなるので、テンキーのキーは２段になるように
調整して、さらに「戻る」ボタンを付けました。

これで一覧画面を見ながらテンキーでの入力ができる画面の
ひな形が作成できました。

これをメモデータベースに組み込んでテストしていく予定です。

使い勝手が悪ければまた直そうと思っています。

【テンキー上部固定画面（縦）】
https://www.dropbox.com/s/v2p3rlt2wdqhjgf/Screenshot_2014-03-26-12-42-58.png
【テンキー上部固定画面（横）】
https://www.dropbox.com/s/6vr3bbixkx67h8i/Screenshot_2014-03-26-12-42-35.png

【テストプログラムやHTMLなど】
https://www.dropbox.com/sh/3n711x2jozesi52/80_eyUVRE1

2chMate 0.8.6/Kobo/arc 7/4.2.2/LT

※書き込む際の注意事項はこちら

※画像アップローダーはこちら

（画像を表示できるのは「画像リンクのサムネイル表示」がオンの掲示板に限ります）