Vagrantを使ってローカルでWordPressを立ち上げる | Dress Cording

2013/07/08 93 users MAMP Vagrant デザイ オーラ machidaさん

とにかく私がやりたかったことは、Wordpressをローカル環境に構築して思う存分デザインがしたい！テーマのバージョン管理がしたい！ということ。そこで @machidaさんに相談してみると・・・「"Vagrant" にしましょう。」 え？！なんだか難しそう。。プログラマ界隈では当然の技術なんだろうな〜。MAMPでいいですかなんて言えないオーラ。 でもWordpressのローカル環境くらいならデザイ... 続きを読む

SassのデバッグにSource Mapsを使うべきたくさんの理由 | Dress Cording

2013/05/13 101 users Sass Tincr Compass デバッグ エディタ

SassやCompassをChrome Developer ToolsでデバッグしたいのにCSSしか参照できなくて困ったり、編集したコードをコピペするのが面倒、エディタに即時反映できたらいいのにって思ったことはありませんか？ この悩みを、Source MapsとChrome拡張「Tincr」を使って解決する方法をご紹介をします。 一連の流れを動画に撮ってみました。 1. Source MapsでS... 続きを読む

Layout、Paintingとは何か？レンダリングから学ぶWebサイトのパフォーマンス | Dress Cording

2013/04/04 166 users layout レンダリングエンジン レンダリング 根拠 前半

どうしたらWebサイトのパフォーマンスを向上させることができるのか？ レンダリングエンジンについて学ぶことで、その根拠を理解していきたいと思います。 前半ではレンダリングプロセスについて、それを踏まえた上で、後半ではJavaScript、CSSそれぞれの高速化、最適化について書きます。 この記事を書き終える頃には、自分でも最適な判断できるようになることを願って。。 もくじ 1. レンダリングの基礎... 続きを読む

WebKitのbackgroundショートハンドのバグがフィックスされるかもしれない | Dress Cording

2013/02/21 42 users ショートハンド WebKit Opera パク 挙動

2/1のHTML5 Rocksのブログによると、WebKitのbackgroundショートハンド・プロパティの挙動が修正され、バージョンの移行が完了次第、モバイル版Webkitのbackground-sizeのショートハンドがW3Cの仕様に準拠し、Firefox、Opera、IE9~と同じ挙動になるとのことです。 いったいどんなバグがあって、どのように修正されるのでしょうか？ ある日突然表示が崩れ... 続きを読む

HTML5 カスタムデータ属性「data-*」にJavaScript、jQueryからアクセスする方法 | Dress Cording

2013/01/30 206 users jQuery Data value カスタムデータ属性 CSS

HTML5では「data-*="value"」の形式で属性名にプライベートな値を設定できるカスタムデータ属性の仕様と、そのカスタムデータ属性にJavaScriptからアクセスするAPIが定義されました。 でも実はJavaScriptだけではなく、jQueryはもちろんCSSからでもアクセスすることができるのです。 それなら私も私だけの属性作ってみたい！ ということで、今回から3回の連載で、Java... 続きを読む

高速で安全なjQueryを書くために今できること | Dress Cording

2013/01/09 865 users jQuery jsPerf 定説 XSS対策 先人達

先人達が模索し続けたjQueryの定説を、私はちゃんと理解できているだろうか？またそれはjQuery1.8~2.0世代の現在においても有効なのだろうか？ jsPerfよりベンチマークをシェアさせていただきつつ、パフォーマンスやXSS対策についても少しだけ。高速で安全なjQueryの書き方をまとめてみました。 jsPerfはベンチマークを自分で作成したり、他の方がつくったものをシェアできるツールです... 続きを読む

HTML5 Drag and dropを実装してみよう | Dress Cording

2012/12/28 38 users

HTML5のDrag and dropには7つもイベントがあってさぞや大忙し!なのかと思いきや、実装に必須なのは3つのイベントだけ。 ということで今回は基本篇として、ブラウザ上でDrag and dropをできるデモをつくってみました。 少し工夫した点と言えば、ドラッグ要素が複数でも大丈夫なように配列にしたり、好きな場所にドロップできるようにイベントの発生場所を取得したところでしょうか。 1. D... 続きを読む

クリスマスに使いたい！雪のパーティクルをチラチラ降らすスクリプトを作ってみよー : actyway

2012/12/10 24 users actyway パーティクル インスピレーション スクリプト

雪やーこんこん！霰やこんこん！ついでに風邪でこんこん！ インスピレーション大切！ 最近お気に入りでよく見させていただいている、Tutstgeek さんにて素敵なスクリプトが公開されていましたので、それに感化されて同じ様な物を作ってみました！Tutstgeek さんは Dress Cording の @Rochas さんに教えていただきました。m(__)mﾍﾟｺﾘ＜ｱﾘｶﾞﾄｳｺﾞｻﾞｲﾏｰｽ!! ... 続きを読む