Webアプリのモックアップ作業土台を作る その1 - cu39's diary
Slim, Sass/SCSS, CoffeeScript が使えて Livereload してくれるフロント周辺の作業環境がほしいと思いながらも自分にしっくりくる構成ができなかったんですが、最近 rack-livereload を見つけてピースが埋まった感じがしたのでまとめます。 https://github.com/cu39/workbench 記事を書くにあたり naoya さんのひな型に大いに影響されてますが、ここでは npm でインストールするのは bower だけにして基本的には Sinatra と Guard に任せています。 Sinatra, Slim, Sass, CoffeeScript 土台の土台としてシンプルな Sinatra アプリから。Gemfile を書いて bundle。 Gemfile source 'https://rubygems.org' gem '
CSS には vw, vh, vmin, vmax という単位がある | DevelopersIO
例として以下の様な HTML 構造があったとします。 <body> <!-- 画像解像度: 100 x 100 (px)--> <img src="images/thumbnail.jpg" /> </body> img { display: inline-block; margin: auto; width: 10vw; } img の幅を 10vw と指定しています。基準となるビューポートの幅を vw で表すと 100vw となります。iPhone 5S のビューポート幅をピクセルで表すと 320px な訳ですが、10vw はその 1/10 ということで32px が img の幅となります。つまり 1vw は 1% と同じ長さになります。もちろんリキッドレイアウトにも対応した動きを持っています。 Demo - viewport lengthを開く（このサンプルはChromeブラウザでの
smartcrop.js - 要注目！スマートなクロップ機能を実現 MOONGIFT
おお、これは格好いい！ 写真のサムネイル表示というのはやり方によって大きくインパクトが変わります。単純に縮めて表示すると何の写真か分かりづらくなります。さらに横長、縦長の写真では正方形に切り出すのは簡単ではありません。 そこで使ってみたいのがsmartcrop.jsです。写真の中から一部を切り出すライブラリで、よりインパクトの強い部分を抽出します。 smartcrop.jsの使い方 デモです。よりインパクトの大きい場所を抽出しているのが分かるかと思います。 切り出す形を変更することもできます。その場合でも写真全体を対象にする訳ではありません。 さらにサンプル。女性を中心に抽出しています。 これは完全に左側から。 ヨットを中心に。サムネイルでも格好いいですね。 街並。より印象的なビルを中心にしています。 こちらは川と太陽が中心です。 人の場合は顔を中心にするようです。 多数の人がいる場合。よ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
OS X MavericksにOracle Instant Client(11.2.0.4.0)をインストールする
github-cheat-sheet/README.ja.md at master · tiimgreen/github-cheat-sheet
