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() を呼ぶことで、スクロールそのものを止めることもできる。
Almin.js | JavaScriptアーキテクチャ
autoscale: true Almin.js | JavaScriptアーキテクチャ 自己紹介 Name : azu Twitter : @azu_re Website: Web scratch, JSer.info 中規模以上のJavaScript 設計が必要になる 正しい設計はない Bikeshed.js :bike: 人、目的、何を作るかによってアーキテクチャは異なる 前回の続き? How to work as a Team Read/Write Stack | JavaScriptアーキテクチャ 用語 設計の目的 中規模以上のウェブアプリ SPAというよりは、画面が複雑なElectronアプリのようなイメージ スケーラブル 人、機能追加、柔軟性、独立性 見た目が複雑ではないアーキテクチャ 書き方が特殊ではなく見て分かるもの 設計の目的 テストが自然に書ける パーツごとに無理なく
Kyoto.js # 9を開催しました - マルシテイア
kyotojs.doorkeeper.jp 2016-02-03、はてな京都オフィスにて Kyoto.js #9 を開催しました。 来場者、登壇者の皆様ありがとうございました！！！ 経緯 京都では技術イベントが少ない。 聞くと、京都では数年前まで Kyoto.js というイベントが開催されていたらしい。 それなりに続いてはいて、Kyoto.なんか みたいな番外編もやっていたのが、なんとなく忙しくてやらなくなってしまった模様。 12月に社内でJSの話をしていた時、Kyoto.js運営やりませんか的な話を振られたので、勿論、やりましょうとなったのだった。 発表 一人目:「IonicFrameworkと何かと何か（仮）」 by @kamiyam Sails + Ionicでアプリやってる話。 Sailsはともかく、IonicとかAngularJSのウケがよくて、質問タイムは大盛り上がりだった。
Frontrend Conference アウトラインメモ
Frontrend Conference - A conference for front-end developer（2015年2月21日開催） に参加してきたのでメモ 殆どCSS側のセッションにいたのでCSSが中心。 終わったあとに#ゴーヤsushiと#ルノアール_sushiをしたのでとても長かった。 Pragmatic Front-end Developer: From Artisan to Expert - 斉藤 祐也 基調講演 メンテンス性 WEBを構成するJS+CSS+HTMLはあんまりメンテしやすくない けど専門的な知識がなくてもかけてしまう学びやすさがある 言語的にシンプル コードスタイルガイドライン 多くの人が開発しても、一人の人が書いたように見えるようにしたほうがいい JavaScript IDOMATIC.js jQuery Code Style GuideLine
フォントジャンプ率のセオリーを考える | フォントの話 | つみきブログ
株式会社つみき UI/UX事業終了のお知らせ 拝啓 時下ますますご清祥のこととお喜び申し上げます。 平素より格別のご高配を賜り、厚く御礼申し上げます。 この度、弊社は創業以来続けて参りましたUI/UX事業（受託制作事業）につきまして、2024年4月30日をもって終了することを決定いたしました。 今後は、弊社の主力事業であるFilmarksをはじめとした、映像関連事業に注力して参ります。 ご愛顧を受け賜りました皆様には、深く感謝申し上げますとともに、ご理解賜りますようお願い申し上げます。 敬具 株式会社つみき 代表取締役社長 鈴木 貴幸 事業終了予定日：2024年4月30日 biz@tsumikiinc.com
nodeconf.eu 1日目 (Future Node.js, microservices, hapi) - from scratch
さて、 nodeconf.eu に来ています。 当たり前なんだけど、nodeconf.eu ではnode.jsを使っているユーザーが多くて、外人ばっかり。 会う人会う人に「お前の国ではNode.jsは流行ってるのか?」って聞いてるんだけど、とりあえずの理解では、「サンフランシスコ、シアトルとかアメリカでは流行ってる。Dublin、ロンドンとかのアイルランド、イギリスでもまぁまぁ流行ってる。スウェーデンでは全く流行っていない。」っていう感じ。 日本ではどうなんだ?って聞かれたから「MatzのおかげでRubyがめっちゃ流行ってるよ、Node.jsも一時期流行ったけどRubyほどじゃない、最近だとGoとScalaが流行ってるよ」って応えてる。 ちなみにサンフランシスコだと、Node.jsめっちゃ流行ってて、Goがちょっと前のNode.jsみたくぼちぼち流行ってる、エッジな人たちがRust使い始め
管理画面チラ見せ♡ナイトの感想と今後｜西小倉宏信｜note
演奏家は他人のいい演奏を見ると刺激になる。 選手は他のいい試合を見ると刺激になる。 Webサービス開発者は他のいいUIを見ると刺激になる。 このように他人の素晴らしい事例を見ると刺激になるけど、 管理画面だけはなかなか見れる機会ないよねっということで はじまったこの企画。 改めまして2014年7月29日の 「管理画面チラ見せ♡ナイト」 に関わって頂けた方、本当にありがとうございました！ 定員70名の会場に200名以上の参加希望があってビビってましたが JSオジサンの小島さんをはじめ、 会場提供頂いたgeechsおだんみつさん、 スポンサーなのに何人もスタッフ参加してくださったグッドパッチ様、 スポンサーかつ管理画面もチラ見せ♡LTして頂いた マーベリック様、 登壇者の方々、司会の須川さん＆ぁゃぴさん そして管理画面にエロスを感じるというマニアックな参加者様の おかげでとても楽しい夜になりま
Angular カンファレンス（ng-conf 2014）Jan. 16 動画まとめ - AngularJS Ninja Blog
ng-conf 2014 – The World’s First Angular Conference in Salt Lake City, Utah Angular カンファレンス ng-conf 2014 が、アメリカはユタ州ソルトレイクシティで開催中です。 YouTube の ng-conf 2014 チャンネル のほうに動画はまとめてアップロードされていますが、このエントリーでは当日（Thursday, January 16）のスケジュールどおりに並べています。最終日（Friday, January 17）の動画は次のエントリーで。 Keynote Miško Hevery & Brad Green AngularJS in 20-ish Minutes Dan Wahlin Writing a Massive Angular App The Google Double Click
ページの下までスクロールしたときに何らかの処理を実行する例 at softelメモ
ページの下までスクロールしたときに何らかの処理を実行する例 $(window).bind("scroll", function() { scrollHeight = $(document).height(); scrollPosition = $(window).height() + $(window).scrollTop(); if ( (scrollHeight - scrollPosition) / scrollHeight <= 0.05) { //スクロールの位置が下部5%の範囲に来た場合 } else { //それ以外のスクロールの位置の場合 } }); demo ページをある程度下までスクロールしたときに何らかの処理を実行する – デモ 「本当にぴったり最下部までスクロールしたら」という条件にすることも可能ですが、ある程度範囲を持たせておいた方がよいことが多いでしょう。 条件
Chrome拡張では、Background pages よりも Event pages を使用したほうが良い - よんちゅBlog
これからChrome拡張を作る方には是非知っておいて欲しい機能、Event pages についての話です。 Event pages は、作成したChrome拡張によっては、必ずしも使用できるわけではありませんが、もし可能なら積極的に使用してほしいと思います。 公式ドキュメントでも、Background pages のページ冒頭には、以下の様な注意書きがなされています。 Caution: Consider using event pages instead. Learn more. via: Background Pages - Google Chrome なぜ Event pages なのか 理由を詳しく説明すると、 Background pages を使用している拡張は、Chrome起動時にプロセスが起動され、以降Chromeが終了するまで生き続けます。 よって、例え Backgroun
addEventListenerのhandleEventオブジェクト - console.lealog();
これはちょっと自分の中で衝撃的すぎたのでメモ。 参考：addEventListener, handleEvent and passing objects | The CSS Ninja - All things CSS, JavaScript & HTML こんなんアリなんかー！ｗ handleEventって用意しておけば var Swiper = function(element) { this.elm = element; // touchstartでthis・・・this?? this.elm.addEventListener('touchstart', this, false); this.elm.addEventListener('touchmove', this, false); this.elm.addEventListener('touchend', this, false
XHR Lv2とFormDataでmultipartのuploadが超絶楽になった | Scene Research Station
以前 、drag and dropとFile APIとXMLHttpRequestを使ったmultipartによるファイルの送信を書いた。実はあのXHRのsendAsBinaryはFirefoxの独自拡張でwebkit等では動かない。 なんかいまいちだよねえ。と思ったら こてさきAjax - BlobBuilderを使ってみた http://blog.livedoor.jp/kotesaki/archives/1557189.html に面白いことが載っていた。 XMLHttpRequest Level2ではBlobやらFormDataがXHRで送れるんだとさ！ なんてこったい。今までmultipartのformをjsで自力で生成してFirefoxの独自拡張でバイナリで送るという涙ぐましい努力をしていたのが、 1 var upload = function(event) { 2 var d
tmlib.js でモーダルウィンドウを作ってみた | TM Life
※ phiary に引っ越しました. 毎日プログラミングやWebに関する情報を発信しています! RSS 登録してたまに覗いたり, tweet やハテブして拡散してもらえると幸いです. tmlib.js には tm.dom.Element というクラスが定義されており, これを使うことで様々な DOM 操作を行うことができます. 今回はそのサンプルとして tmlib.js でモーダルウィンドウを作ってました. サンプルは jsdo.it で作成しております. Table of contents サンプルについて ソースコードの解説 DOM 要素をクエリで取得 イベントリスナをさくっと登録! 一度しか実行しないイベントを登録する スタイルをサクッとセット 属性をサクッとセット tmlib.js hackthon #1 やります! サンプルについて 左上のボタンを押すとモーダルウィンドウが表示さ
WebPerfDays: Performance Tools | High Performance Web Sites
October 9, 2012 5:06 pm | 25 Comments I just returned from Velocity Europe in London. It was stellar. And totally exhausting! But this post is about the other fantastic web performance event that took place after Velocity: WebPerfDays London. WebPerfDays is like a day-long web performance meetup event. Aaron Kulick organized the first one last June right after Velocity US. He had the brilliant ide
【HTML5】File APIを使って、投稿された画像を即時表示する方法【小ネタ】
こんにちは、橋本です。 今回は小ネタを１つ紹介したいと思います。 画像投稿フォームを作る際に、投稿された画像を即時表示したいなんてことありませんか？ そんなときに便利なのが、HTML５で追加されたFile API。 File APIを使えば、投稿された画像（正確には、選択されたローカルファイル）の情報を取得することができます。 では、画像投稿機能のサンプルを元に、File APIの使い方を見て行きましょう。 File API自体はjQueryと何の関係もありませんが、いろいろと面倒なので今回もjQueryを使っています。 サンプル <!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="UTF-8"> <script src="http://code.jquery.com/jquery-latest.js" type="text/jav
ちょっと高度にJavaScript／クロージャでイベントハンドラを作る | DevelopersIO
前回の解説では、クロージャの「変数が保持される」「変数が隠蔽される」という特徴を使って、アクセサメソッドを作りました。 今回は、「呼ぶたびにクロージャが生まれる」特徴を使ってみます。 繰り返し処理内でイベントハンドラを作る まずは、何の工夫もなくやってみます。今回はjQueryも使います。 $(function() { var data = [ {label:'リンク１', value:1}, {label:'リンク２', value:2}, {label:'リンク３', value:3}, {label:'リンク４', value:4}, {label:'リンク５', value:5} ]; var ul = $('<ul/>'); for(var i = 0, l = data.length; i < l; i++) { var item = data[i]; var li = $('
Registration: Machine learning & data conference | O'Reilly Strata
We’ve made the very difficult decision to cancel all future O’Reilly in-person conferences. Instead, we’ll continue to invest in and grow O’Reilly online learning, supporting the 5,000 companies and 2.5 million people who count on our experts to help them stay ahead in all facets of business and technology. Come join them and learn what they already know. Become an O’Reilly online learning member
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Use existing JS framework, not roll-your-own · Issue #15 · jakearchibald/tweetdeck-prototype
JSConf US 2013
http://atnd.org/events/35720
