江戸一番のジャスタウェイ職人のブログ

江戸一番のジャスタウェイ職人

UI

制作合宿してきた話

金・土・日と企画者宅で大量のビールとピザを消費しながらWebサービス制作をしてきました。http://bookma.org/レスポンシブWebデザインはウィンドウを縮めると「あぁスマートフォンではこう見えるだな」というのが確認できて素晴らしいです。2013春アニメま…

contenteditableな要素にフォーカスが当たっている時にdraggableが要素をクリックするとバグる(Chrome)

Chrome: 25.0.1364.172 動作サンプル: http://jsdo.it/su_aska/tdQh <div contenteditable="true"> Editできる奴 </div> <div draggable="true"> D&Dできる奴 </div> この「Editできる奴」をクリックした後に「D&Dできる奴」をクリックしても「Editできる奴」のカーソルが消えないのだ。(Chrome: 25.0.1364.172)https://gi…

ふわっと出るDropdownメニュー

http://www.red-team-design.com/wp-content/uploads/2011/11/css3-animated-dropdown-menu-demo.htmlなんかこれっぽい感じにしたくてやってみた。http://jsdo.it/su_aska/djEa表示のon/offをdisplay: block/display: noneでスイッチするとCSS3のアニメーシ…

レーティングのナビゲーション

カーソルがあたるとレーティング用のインターフェース(☆)が見えて、カーソル位置(画像の場合4)までの星を付けられるというのを実装してみた。 ※画像は開発中のものです入れ子が激しくてなんか嫌な感じだが...、他に良い案があったら教えてください。 <span class="star"> <span> <i class="icon-star-empty"></i> <span></span></span></span>…

使いながら利用者とともに成長するUI

最初はボタンにラベルとかあってわかりやすく、把握したら隠してスッキリと、使う機能だけ展開しておけばゴチャゴチャしない初期状態 ラベル非表示、かなりスッキリする ツールバーを展開 ※画像は開発中のものです /* * 表示切り替え */ body:not(.display-h…

レスポンシブ・レイアウト(仮)

※画像は開発中のものです広い時は横に並べる 狭い時は右下に固定(かつオーバーレイ) タッチデバイス向けは別ページを用意していてターゲットはPCのみだけど、使用可能な最小サイズを押し下げたかった、PCだからといってブラウザをデカく使っているとは限ら…

使い慣れると冗長だけと使い始めは欲しいみたいなメッセージのon/off

使い慣れると冗長だけと使い始めは欲しいみたいなメッセージはon/offできるといいなと思います。Excelでツールバーをアイコンだけかアイコン+ラベルか選べるとかよくあるUIです。無刻印HHK使ってる人とかアイコンだけのモードが好きなんじゃないかと思いま…