ドットインストール代表のライフハックブログ
![IDEA * IDEA](https://cdn-ak-scissors.b.st-hatena.com/image/square/7eba834140969b3d164656cf256966775bc5e835/height=288;version=1;width=512/http%3A%2F%2Fwww.ideaxidea.com%2Fwp-content%2Fuploads%2F2014%2F05%2FGoogle-Chrome.png)
PixelGuide これなに PhotoShopでガイドを引くのと同じ感じでブラウザでガイドを引くChrome拡張です。 ほとんどの機能はRulersGuides.jsというライブラリを使って実現しています。 使い方 ここからPixelGuideをChromeにインストールします。 アイコンをクリックするとパネルとルーラーが表示されます。 ルーラーの上にカーソルを乗っけて、そこからクリックしてドラッグするとガイドが引けます。 簡単。 パネル アイコンをクリックすると開くパネル。 機能を上から。 各種要素の表示/非表示切り替え All: 全ての表示/非表示の切り替え (ガイドが表示されているときは下の要素に触れないので触りたいときは非表示にします) Guide: ガイドの表示/非表示の切り替え Ruler: ルーラーの表示/非表示の切り替え Info: 各グリッドの大きさなどの情報の表示/
otiai10です。最近はフロントエンドのTypeScriptを書くお仕事をしています。個人的に艦これウィジェットやtwickというChrome拡張を作ってたりもします。先に言っておきますが、これらはどちらもGithubでソースコードを公開しており、悪いことしようが無いです。 端的に言うと、Chrome拡張はヤバいです。何でもできちゃう。 どんくらいヤバいか知ってもらうためにどうしようか考えた結果、ヤバいChrome拡張を作りました。30分かかんなかったです。 https://github.com/otiai10/chrome-twitter-hijack-sample (「レポジトリをforkして悪用する人間が出てくるかもしれない」とのご指摘を頂いたので、これを削除します) git cloneしてchrome://extensionsからパッケージ化されていない拡張機能を読み込むでこのr
ウェブサイトはレイアウトや文字の選択で雰囲気がガラっと変わるため、人目を引くウェブサイトが使っているフォント名・文字サイズ・文字の色などは気になるところです。文字の上にカーソルを置いたりクリックしたりするだけでフォントの種類や詳細が分かるGoogle Chrome拡張機能が「WhatFont」で、気になるウェブサイトのデザインの秘密が簡単に分かるようになっています。 WhatFont Tool - The easiest way to inspect fonts in webpages « Chengyin Liu http://chengyinliu.com/whatfont.html Chrome ウェブストア - WhatFont https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpml
Chrome Experiments is a showcase of work by coders who are pushing the boundaries of web technology, creating beautiful, unique web experiences. You'll find helpful links throughout the site for creating your own experiments, and you can also explore resources like WebGL Globe and our workshop of tools.
先日、勉強会でAdobe Bracketsをはじめて触ってきました! 私はST2に恋している身なのでそこまで興味はなかったのですgげふんげふん!これ、使ってみたらなかなか良かったのですよ…! なので、今日はそこで学んできたAdobe Bracketsの魅力と、コーダー必須アイテムであるEmmet(Zen-Coding)のインストール方法を皆さんにご紹介したいと思います!! というわけで、@stocker_jpさんがオープンされた教室『Stocker.jp / Space 』にて行われた@glatyouさんのAdobe Brackets勉強会にいってきました。 こういう勉強会に参加して、アプリケーションに触れてみるのって大事ですねー。ST2の時も触るまで微塵も興味なかったなぁ…w Adobe Bracketsとは Adobeから出ている無料のテキストエディタです。CCに加入している必要はなく
こんにちは、広告事業部でLINEやNaverまとめ、livedoorの広告企画を担当しておりますディレクターの阿部です。 ウェブディレクターの皆さんの中でも愛用している方が多いと思われるGoogleのウェブブラウザ、Google Chrome。その速さには定評がありますが、ディレクターの仕事をさらに捗らせてくれる拡張機能(Extensions)は活用していますか? 今回は、私が常用しているChromeの拡張機能を、一気に20個紹介したいと思います。皆さんの業務効率化に役立つようなら幸いです。 ※こちらの記事は私の個人ブログからの転載です。 検索を捗らせる系 ato-ichinen Activeにしている間、Google検索結果を1年以内のものに限定する拡張機能。フレッシュな情報のみを検索したい時に便利。
Chrome は単体で PDF を印刷する機能を持ってて便利なんですが、CSS の background-color や background-image が反映されません。 「背景を印刷」みたいなオプションも見当たらなかったので、無理なんかなーって思ってたんですが、どうやら CSS で解決できるっぽいです。 @media print { body { -webkit-print-color-adjust: exact; } } 人様のページであっても、デベロッパーツールを使えばなんとかなります。 -webkit ってベンダープレフィックスが付いてますが、Safari 5 では動きませんでした。 未だに Snow Leopard を使ってるもんで、Safari 6 は確認できてません。 以下、参考にさせてもらいました。 TIP: Print CSS backgrounds in Googl
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く