kimizuka.hatenablog.com先日、iOS版のChromeがアップデートされたということで再度調べました。こちらの記事 とあわせてご確認ください。 検証方法 スクロール中にsetIntervalが動くか確認 こちらのコード をブラウザで開く ページをスクロールしながら観察…

chibadge.kimizuka.fmかつてchibadge（チバッジ）のアプリアイコンをつくったとき、 デザイン 実機に移してバッジをつけて確認 調整 2に戻る という感じでデザインを調整していました。 それがとてもめんどうなので、バッジのついた状態をプレビューするツー…

kimizuka.hatenablog.com この記事 のAndroid版です。一昔前はページスクロール中はJSが止まってしまうことがあたりまえだったスマートフォンのブラウザ。 なのでスクロール連動のサイトとかを実装するときはいろいろ大変でした。（自前でスクロールを実装し…

前回の記事 の応用編です。kimizuka.hatenablog.com マークアップをしていると、「シェアボタンによってOGPを切り替えて欲しい」と頼まれる瞬間がやってくると思います。 そんな時こそ Feed Dialog（フィードダイアログ） の出番だと思われます。 DEMO http:…

Facebookのウェブ用グラフAPIは、 Feed Dialog Send Dialog Share Dialog と3つ用意されています。developers.facebook.com 今回は個人的に最もお世話になっている Feed Dialog についていろいろ調べてまとめてみました。 Feed Dialog（フィードダイアログ）…

マークアップをしていると、「縦方向にはfixedにしたいけど、横方向にはfixedしたくない」と思う瞬間がやってくると思います。 そんな時はJavaScriptでウィンドウのスクロールを監視し、fixedした要素のleftを設定するだけで実装できます。 HTML <div id="header"></div> CSS body {…

developers.facebook.com自分のFacebookアカウントのIDを調べようと思って、意外と苦戦したの確認の仕方をメモしておきます。1. Facebookにログインして https://developers.facebook.com/tools/explorer にアクセス 2. Get Token のなかの Get User Access …

一昔前はページスクロール中はJSが止まってしまうことがあたりまえだったiOSのブラウザ。 なのでスクロール連動のサイトとかを実装するときはいろいろ大変でした。（自前でスクロールを実装したりしてました） しかし、最近のSafariはスクロール中にもJSが動…

きっかけは この記事 を読んだことにあります。 （もう1年以上前の記事なんですね）gigazine.netいろいろと参考になることが書いてあるのですが、なかでも一番気になったポイントは右手でスマートフォンを操作する人の指の届く範囲を表したこの図でした。 ht…

CSSでグラデーションをアニメーションさせる方法として、 こちらのサイト でつかわれている、background-positionをつかった方法が有名です。www.gradient-animator.com ものすごく単純ですが、今回はafter要素をつかい2つのグラデーションレイヤーを重ねて…

最近、ひさしぶりタスクランナーなしでコーディングをしました。タスクランナーなしで作業するときは、JSHint, a JavaScript Code Quality Tool や The W3C Markup Validation Service でバリデートをかけたり、jshint.comvalidator.w3.org/packer/ 、 CSS M…

同一ドメインのとき parent.location.href で親のURLを取得できます。iframeが入れ子になっている場合も親のURLになります。 入れ子になったiframeの大本の親のURLが知りたい場合は、 top.location.href で取得できますが、すべてのiframeが同一ドメインであ…

See the Pen Form for Email by kimmy (@kimmy) on CodePen.タイトルのとおりです。 ＠以下の一文字をタイプしたときに、 @gmail.com, @yahoo.co.jp, @hotmail.co.jp, @docomo.ne.jp, @ezweb.ne.jp, @softbank.ne.jp をサジェストします。 ソースコード HTML <div class="input-box"></div>…

ものすごく単純なことなんですが、右クリックして「情報を見る」を選択するとフォルダ全体の容量を確認できることを知りました。 ImageAlphaとかをかけた後にどれ位効果があったのかを測るときに便利です。

User-Agent Switcher for Chrome chrome.google.comUAの切り替えはディベロッパーツールでもできますが、タブ毎にUAを切り替えることのできる拡張です。 拡張を開発する際 に参考にするために導入しそのまま活用しています。kimizuka.hatenablog.com Google …

これまではレンタルビデオはもっぱらiTunesをつかっていましたが、 ここ最近はAmazonのプライムビデオを観まくっていたため、はじめてAmazonビデオのレンタルをつかってみようと思った時のことです。いざレンタルを申し込む直前に、「ちなみにiTunesでのレン…

お題「ブログをはじめたきっかけ」 ブログをはじめたきっかけ 完全に職場の先輩に触発されてはじめました。 「スキルなし・実績なし」 32歳窓際エンジニアがシリコンバレーで働くようになるまで from Shuichi Tsutsumi www.slideshare.netこのスライドがきっ…

お題「新年の抱負」私は一流の料理人だ。一流の料理人の条件は、既に一流と呼ばれている料理人に一流と認めてもらうことである。私はそう考える。 一流の料理人は、新しい調理法の研究を怠らない。 だから私も日々新しい調理法を研究している。すべては一流…