forループの中でsetTimeoutしたらiはどうなるか - console.lealog();
この手の話題は記事タイトルが本当につけにくいｗ 今回も備忘メモです。 for(var i = 0; i < 3; i++) { setTimeout(function(){ console.log(i); }); } このコード、実行するとどうなるでしょう？ こうなる for(var i = 0; i < 3; i++) { setTimeout(function(){ console.log(i); }); // 3 が3回 } 思ってたのとちがう！ こうすればOK for(var i = 0; i < 3; i++) { (function(local){ // とじこめる setTimeout(function(){ console.log(local); }); }(i)); // とじこめる！ } すごーくざっくりした理解ですが、 JavaScriptはシングルスレッド setT
Rippler · Effect that spreads like a wave in touch or click.
You can also use the buttons on the bootstrap. rippler-inverse rippler-default rippler-inverse rippler-default rippler-inverse rippler-default <a class="btn btn-default rippler rippler-inverse" href="#">rippler-inverse</a> <button class="btn btn-primary rippler rippler-default">rippler-default</button> <a class="btn btn-success rippler rippler-inverse" href="#">rippler-inverse</a> <a class="btn bt
Techniques for Responsive Typography | Codrops
When it comes to responsive type on the web, there’s more to do than just resizing the text’s container and having the text reflow inside of it. This in-depth article covers various techniques for making text responsive. One of the most important aspects of responsive web design is responsive typography. When it comes to responsive type on the web, there’s more to do than just resizing the text’s
Cool Social Buttons jQuery Plugin
As much as we hate them, social sharing buttons are necessary to make it easy for visitors to share our content with their friends and professional networks. But as web developers, we have to be weary of the slow down that sharing buttons bring. Every button that you include in your page loads its own set of scripts and stylesheets which make your pages slower to load. This is why today we are rel
Responsive Web Design with DevTools' Device Mode
$200K 1 10th birthday 4 abusive ads 1 abusive notifications 2 accessibility 3 ad blockers 1 ad blocking 2 advanced capabilities 1 android 2 anti abuse 1 anti-deception 1 background periodic sync 1 badging 1 benchmarks 1 beta 83 better ads standards 1 billing 1 birthday 4 blink 2 browser 2 browser interoperability 1 bundles 1 capabilities 6 capable web 1 cds 1 cds18 2 cds2018 1 chrome 35 chrome 81
Professional website creation in web studio - Incredible Web
We are a team of ambitious professionals obsessed with digital. We create projects for […] Professional website creation in web studio In an age when most people search for products, goods and services via the Internet, you have the power to make your company a leader among competitors and receive a steady daily flow of new customers. For more than 3 years we have been working with this goal in ou
Google Web Fonts Typographic Project
Hand-Picked Tales from Æsop’s Fables with Hand-Picked Type from Google Fonts There are over 800 Google Fonts available for free. But, pairing typefaces isn’t easy and many of those fonts don’t work for typical websites. Part of the 25x52 initiative, this collaborative, ongoing project offers inspiration for using Google’s font library.
CSS and JavaScript Slide in panel | CodyHouse
Slide In Panel A CSS3 and JavaScript powered slide-in panel, to quickly show side content, notifications or profile information. There will be cases when you need to display side content (a notification, a user profile information...), and this content doesn't fit into a tooltip. You may create a new page and link to it, but, when possible, it's wise to avoid a page refresh. In these cases a panel
Using SVG to Shrink Your PNGs
07 Sep 2014 Wouldn’t it be great if you could get the compression of a JPEG with the transparency of a PNG? Well, you can, sort of. Here’s a little trick that I discovered while working on the new Sapporo Beer website. Notice how the beer can on the Sapporo website has a transparent area around the edges (it’s hard to notice but there’s a video playing behind it). As a PNG, the beer can graphic wo
Account Suspended
Account Suspended This Account has been suspended. Contact your hosting provider for more information.
Why moving elements with translate() is better than pos:abs top/left - Paul Irish
Update (2016): The more canonical writeup of this technique is at High Performance Animations - HTML5 Rocks. TL;DR: Only transform & opacity; never top/left! In modern days we have two primary options for moving an element across the screen: using CSS 2D transforms and translate() using position:absolute and top/left Chris Coyier was asked why you should use translate. Go read his response which c
第56回PHP勉強会＠関東で PHPUnit について話してきた | Born Too Late
最近 HTML5 化した Slideshare ですが, エラーで表示できないスライドが多すぎてまともに閲覧できないようです. この記事に掲載している Flash 版は今まで通りの問題なく表示できるのですが... スライドが完成したのが勉強会への出発 15 分前で, 通しで練習することすらできず, 発表はかなりひどいものとなっていまいました. 最低限, スライドの流れぐらいは頭の中に入れて発表すべきですね… スライドだけ見てわかるような作りにはなっていないので, 以下で補足したいと思います. ただし, 序盤は省略し, 本論となる書法編とパターン編についてのみとなります. それぞれ該当するスライド番号も付記してありますので, よければご活用ください. 書法編 1: ヘルパーメソッドを使う (25 ~ 30) テスト対象のオブジェクト, それを生成するのに必要な依存オブジェクトの生成には, ヘ
Macを購入したら最初に導入しておきたいQuick Lookのプラグイン
Quick Lookは、macOSを代表する便利な機能です。フォルダーやファイルを選択した状態で␣（スペースキー）を押すと、アプリケーションを起動することなく内容を表示してくれます。また、プラグインを導入することで、さらにQuick Lookの機能を拡張できます。今回は、オススメのプラグインを紹介します。 プラグインのインストール方法 プラグインの中には、後述のHomebrew Caskを使用したCUIからのインストールが可能なものと、直接公式サイトからダウンロードして手動で導入するものの2種類があります。Homebrew Caskについては後述しますので、手動でインストールする場合の方法をご紹介します。 手動でインストールする場合 ダウンロードしたプラグイン（.qlgeneratorという拡張子のファイル）を、以下のどちらかにコピーしてください。 ~/Library/QuickLook
Specificity Calculator
A visual way to understand CSS specificity. Change the selectors or paste in your own. Specificity Calculator was built by Keegan Street. The specificity calculator JavaScript module is available on GitHub or via npm install specificity. Specificity Calculator is built for CSS Selectors Level 4. Care has been taken to ensure results are accurate. If you find a defect, please report it.
オブジェクト指向の法則集 - Qiita
この記事は、故石井勝さんが1999年に書いた記事を Qiita に転載するものです。オブラブ(objectclub.jp)にて記事をホスティングしていましたが、現代でも十分に読める内容なので、たくさんの方に読んでもらいたいと思い、若干の編集（リンクとコンテキスト追加）を平鍋が行い、転載します。今でも、読みやすく、カジュアルな語り口のよい記事です。 オブジェクト指向の法則集（転載元：http://objectclub.jp/community/memorial/homepage3.nifty.com/masarl/article/oo-principles.html ） なお、この記事の他にも石井さんのオブジェクト指向やRubyに関する多くの記事をオブラブの「まさーるのページ」で読むことができます。では、以下に石井勝さん（旧メールアドレス masarl@nifty.com）の記事を転載します
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Be careful with setTimeout in loops (Example)
A Single Div
Ceaser - CSS Easing Animation Tool - Matthew Lein
Google
Pure CSS3 Slideshow
zshでgitの補完を設定する手順。
Media Queriesの指定について - Qiita