Muuri - Infinite layouts with batteries included
what & why? Muuri creates responsive, sortable, filterable and draggable layouts. Comparing to what's out there Muuri is a combination of Packery, Masonry, Isotope and Sortable. You can build pretty amazing layouts without a single line of JavaScript these days. However, sometimes (rarely though) CSS just isn't enough, and that's where Muuri comes along. At it's very core Muuri is a layout engine
これはかなり気になる！スタイルシートの可能性が広がるReact.jsのCSS版のようなスクリプト -Descartes | コリス
「React: CSS in JS」からインスピレーションを得て、CSSをJavaScriptで記述し、スタイルの定義、変数・関数の利用、レスポンシブやスクロールなどのイベントに動的に値を生成できるスクリプトを紹介します。 Descartes Descartes -GitHub 上記ページではクリックする度に、背景色の値が動的に適用されています。 Descartesの特徴 Descartesの使い方 Descartesの特徴 DescartesはSassやLessのようなCSSプリプロセッサの良い点を取り入れ、CSSをJSONとして記述するとどうだろうと始めたオープンソースのプロジェクトです。スタイルのセットだけでなく、DOMへのアクセスや基本的なイベントリスナーに対応しています。 Descartesの書式は、SassやLessに似ています。 Descartesの基本スタイル パフォーマン
Web制作時に備えておくと便利なチートシートのまとめ（iOS, Android, Bootstrap, WordPress, Git, Sublime Text, Emmetなどいろいろ）
iOS/Androidの各デバイスやエレメントの規格、BootstrapやFoundationなど人気のフレームワーク、WordPressのテーマファイル、Git/GitHubの便利な機能、Sublime TextやEmmetの使い方をまとめたチートシートなど、フロントエンドのWeb制作者に役立つチートシートをまとめました。 Web制作時によく使うサイズとかスニペットとかショートカットとか、チートシートを印刷してすぐに見られるようにしておくと便利ですよね。 チートシートの目次 iOS デザイン チートシート Swift チートシート Android チートシート Android デザイン チートシート Twitter Bootstrap 3 チートシート Foundation チートシート WordPress 時短用チートシート WordPress テーマ開発用チートシート GitとGit
CSSのローディング・アイコンのコスト
今までは主にアニメーションGIFで作られていたローディング・アイコンをCSSアニメーションで作るみたいなのが流行っている。面白いとは思うし、ちゃんと作ればスケーラブルなので便利そうでもある。けれどもローディング・アイコンを表示するための空要素が必要になり、かつ後にそれを消さなくてはならない。CSSだけだと面倒くさそうだ。 どういうローディング・アイコンかはこの際問題ではないので、とりあえずmain要素以下に何かしら(仮にサムネイルとする)をロードするまでローディング・アイコンを表示することを考えてみる。普通はJavaScriptでローディング・アイコンの追加→サムネイルのビルド→ローディング・アイコンの削除→サムネイルの追加とやるわけだけど、ローディング・アイコンの追加と削除でDOM操作を伴うのはコストがある気がする。 <main id="result"> <div class="spin
シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋
最近多いですねー、1ページで完結するタイプのサイト。One Page Loveのサイトなんかから、シングルページの事例も大量に見ることが出来ますし、パララックスやらフリップ型のコンテンツやら、なんか色々出てきてて着いて行くのがやっとです… でも実際シングルページをつくろうとすると、え？何これどうなってんの？って物も多くてビビることもしばし。 ってことで、今日は僕が知ってる中で『お、これ、シングルページ作る時に使えるんじゃね？』って物を幾つかご紹介させて頂きます！ 主にはシングルページデザインの表現の幅を広げるjQueryプラグインの紹介になるかなと思いますが、楽しい物も多いので、是非興味があれば試してみてくださいませ〜！ それではいってみましょー！ パララックススクローリング系プラグイン この辺は以前に紹介したことがあるものばかりなので、ぱぱーっと行きます。 jQuery Waypoint
フォームの入力欄にテキストを表示する際、ユーザーが使いやすくよりセマンティックに実装する方法
フォームの入力欄にテキストを表示するテクニックとして、HTML5のplaceholder属性やtitle属性にいれたテキストをスクリプトで置き換える方法などがあります。 しかし、placeholderはplaceholderなので、ラベルの代替として利用するのはW3Cでも推奨していません。 参考：The placeholder attribute -W3C フォームに余分なHTMLを追加せず、ラベルを利用してシンプルに解決する方法を紹介します。 入力時はラベルがツールチップで 実装 実装のポイント label要素内のテキストをラベルとして利用する。 初期状態でラベルのテキストを表示する。 入力時にもラベルがユーザーの目に見えるようにする。 ラベルの配置はフォームとページのレイアウトで行われるようにする。 スクリプトが利用可能でない時でも、ラベルを利用できるようにする。 これらのポイントを踏
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Flatis
iDangero.us