タグ

2016年6月9日のブックマーク (4件)

  • Passive Event Listeners によるスクロールの改善 | blog.jxck.io

    Intro DOM のイベントリスナの仕様に Passive Event Listeners というオプションが追加された。 このオプションは、主にモバイルなどでのスクロールの詰まり(Scroll Junk) を解決するために導入されたものである。 今回は、この仕様が解決する問題と、サイトへの適用を解説する。 Passive Event Listeners Spec Scroll Event の PreventDefault() 画面のスクロールに合わせたインタラクションを実装する場合、 Scroll Event にイベントリスナを登録する。 典型的な例では touchstart や touchend をフックし、その中で DOM の操作などを実施するなどがある。 場合によってはイベントリスナ内で preventDefault() を呼ぶことで、スクロールそのものを止めることもできる。

    Passive Event Listeners によるスクロールの改善 | blog.jxck.io
  • フォームのauto fill / auto complete の発動条件 - それマグで!

    chrome で場当たり的に調べたので漏れあると思います。 指摘いただければ感謝です。 auto complete でフォームに入力処理の順番 ブラウザがHTMLを取得 HTML の ノードを展開 form を探す FORM を見つけたら input[password] を探す。 input / form に autocomplete=off がないことを確認 コンプリートできるなら、keychain や保存済パスワードを検索 保存済パスワードに該当エントリがあれば補完候補として取り出し。 DomContentLoaded が重要。 DomContentLoaded が発火したタイミングで、ブラウザはパスワードを準備する。 このとき、HTML 中に form が存在し無くてはならない。 DomContentLoadedのタイミングで//form//input[@password] があるか

    フォームのauto fill / auto complete の発動条件 - それマグで!
    kyaido
    kyaido 2016/06/09
  • GPU text rendering in webkit

    Webkit will render an element differently when the responsibility of painting it is passed from the CPU to the GPU. This switch can trigger unintended rendering artefacts which, although most obvious in text, apply to all types of content. Changes in antialiasing With the exception of IE11, every browser I tested uses subpixel antialiasing on the CPU. If an element is promoted to the GPU in curren

    GPU text rendering in webkit
    kyaido
    kyaido 2016/06/09
  • CSSで指定した小数点以下の値はどのようにpxにまるめられるか - Coding Design's Tumblr

    レスポンシブWebデザインでは幅にパーセントを使った指定をします。 そのパーセント値やパーセント値からpx値に置き換えた値は小数点以下の値が出てくることがよくあります。 そんなときブラウザはどのようにまるめる計算しているのかを検証したエントリーがあったのでご紹介。 まず、最初にブラウザのアクションは2つあります。 ひとつはパーセンテージの丸め方。 IE7-11…小数点第二位に切り捨てる上記以外のモダンブラウザ…より多くの小数点以下の桁数を丸めるもう一つはパーセンテージから割り出されたピクセル値の出し方。 IE8を例にみてみます。 例コンテナの幅は 1325pxコンテナ内のボックスに幅 50.5290112% を指定このボックスの幅は計算上は 669.5093984px ( (1325 / 100) x 50.5290112)IE8では669pxになるIE8でどう計算されているかというと、

    CSSで指定した小数点以下の値はどのようにpxにまるめられるか - Coding Design's Tumblr
    kyaido
    kyaido 2016/06/09