![Jot Touch with Pixelpoint | 進化した3.18mm極細iPadスタイラスペンを徹底レビュー。2048レベルの筆圧感知でAdobe Creative Cloud対応【後編】](https://cdn-ak-scissors.b.st-hatena.com/image/square/19af863af775b44529dca26167954e045aceb598/height=288;version=1;width=512/https%3A%2F%2Fi0.wp.com%2Fnecojita.com%2Fwordpress%2Fwp-content%2Fuploads%2F2014%2F06%2Fjottpix-300x3001.png%3Ffit%3D300%252C300)
2番目にホバーすると、2番目が広くなります 実装のヒントになったのは「Outdated Browser」のメインUIで、このflexboxを使ったUIだけでなく他にも面白い仕掛けが施されています。 Outdated Browser 実装はこんな感じです。 HTML HTMLは非常にシンプルで、各カラムはリスト要素で実装しています。 <ul> <li>One</li> <li>Two</li> <li>Three</li> <li>Four</li> <li>Five</li> </ul> CSS CSSも非常にシンプル、「display: flex;」で各カラムを設定し、通常時に「flex: 1;」、ホバー時に「flex: 3;」になるようにします。 ※flexboxのブラウザのサポート状況 下記のコードは、各カラムにカラーを設定するだけでそのままコピペで使えます。 body { colo
5分でわかるVue.jsと、jQueryで頑張ってはいけない理由 先日の「OpenIL vol.2」にて「5分でわかるVue.js」というLTを発表しました。 【スライド有】インフィニットループ公開勉強会「OpenIL vol.2」開催レポート 前編 【スライド有】インフィニットループ公開勉強会「OpenIL vol.2」開催レポート 後編 この記事は、その時のLTの資料を元にブログ化したものです。 jQueryは頑張れば頑張るほど辛くなる jQuery、簡単に動きのあるサイトを作れてとても便利ですよね。 // 何か画面に反映する $(".hoge").html("変更したい内容"); // 変更時に何か処理して変更する $(".foo").on("change", function() { $(".bar").html("変更したい内容"); }); イベントを受け取って、色々と処理をし
Material Design Google I/O 2014 で新しいデザインガイドラインが発表されました。 Google Design その中で注目されるキーワードが「Material Design」です。これは直訳すると「素材のデザイン」という感じになりますが、これは現実世界の素材をメタファーとすることでユーザーにとってわかりやすくなるように考えられたデザインのようです。 ということで、Material Design について簡単にまとめつつ、どうやってデザインを始めていけばいいか考えていきたいと思います。 Google Design のガイドラインを個人的に解釈した内容を掲載しています。誤解などありましたらコメント欄にて連絡ください。喜んで修正します。 イントロダクション まずはじめに Material Design の概要です。本文をそのまま引用します。 We challenge
概要 V8でES2015のイテレーション周りの実装が進んできたので、解説してみようと思う。 イテレーションとは ここではデータの要素を繰り返して取り出すこと。 例えば配列のforEachメソッドは、要素やインデックスをイテレートするイテレータである。 ただしこれらは(内部的に)繰り返しまで行うイテレータ(内部イテレータ)だが、ES2015では外部イテレーションのための仕組みが入った。 イテレータオブジェクト イテレータオブジェクトは『次の要素』を返すメソッドを備えているオブジェクトである。 つまりイテレーションの『次の要素を取り出す』ことだけを担い、それを繰り返すことは外で行われる(外部イテレータ)。 例 Array.prototype.values()は配列の要素を順番に列挙するイテレータオブジェクトを返す。 var ary = [5, 4, 3] var iter = ary.valu
を晒すことで俺以外が試してくれるかもしれない!というのは置いといて、現在の知見です。 MV* React | A JavaScript library for building user interfaces Facebook製データバインディング。jsxという謎拡張子に目をつむれば未来を感じる設計。とにかく生DOM触りたくないという気概を感じる。 Welcome - Polymer Google製WebComponent。WebComponent使うならこれが有望株っぽい。 component/component MV* とはちょっと違うけどCSS/JavaScript/HTML まとめてライブラリにできる。JavaScript以外もライブラリに含む際は有望。 何がしたいかはt_wadaさんがまとめてくれたtogetterみてください。Web フロントエンド開発用パッケージマネージャ c
よくカメラの表示でみる「ヒストグラム」って何ですか?2014.06.25 20:005,727 そうこ わかりやすく教えてください。 ヒストグラムとは、縦軸に度数、横軸に階級をとった統計グラフの一種で、データの分布状況を視覚的に認識するために主に統計学や数学、画像処理等で用いられる。(Wikipedia参照) …そんなこと言われても、ピンとこないからもっと簡単に言ってください。 デジタルカメラのディスプレイ表示や写真編集ソフトで1度は目にしたことがあるヒストグラムのグラフ。どんな意味で何を示しているのか、たった5分のこの動画を見ればしっかりわかります。 ヒストグラムとは、平たく言えばその画像のトーン(明暗)をグラフにしたもの。つまり、どれだけ明るいか暗いか、です。 ご存知のとおり、デジタルカメラの写真データなどは点(ピクセル)によって構成されています。ヒストグラムのグラフは、まず1ピクセル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く