(追記[2016/09/12]:) この記事へのアクセスが多いですが、古いバージョンなので、ブログトップで最新の情報をご確認下さい*1。 hogashi.hatenablog.com ――― 新年明けましておめでとうございます。2016年もよろしくお願いします。 GoogleChrome拡張機能、「twitter画像原寸ボタン」(改名しました!)の ver. 2.0 を公開しました。初めてのメジャーアップデートです。 (追記[2016/04/10]:) 最新バージョンは ver.2.0.5 です。以下の記事をご確認ください。*2 hogashi.hatenablog.com (2016/01/04 追記): 個人Webサイトにページを作りました*3(以下のリンク)。この拡張機能の概要、ブックマークレットのリンクを載せてあります。http://hogas.moe/tooi.html(追記(2
WordPress 4.4で実装されたレスポンシブ・イメージをブラウザでテストしていた際、はまってしまって多くの時間を浪費してしまったので注意点を書き留めておきます。レスポンシブ・イメージをテストする際はお気をつけください! 目次 キャッシュにご注意 Retinaディスプレイで見てませんか? 開発者ツールの設定など 1. キャッシュにご注意 Mac Chrome 47でテストをしていて、ウィンドウ幅を変えてもレスポンシブ・イメージが反映されなくて不思議に思っていたんですが、よく考えてみたら画像がキャッシュから読み込まれていました。。。 Mac Chrome 47では、srcsetに記述のある画像がキャッシュにある場合、ウィンドウ幅を変えただけではそれ以下のサイズの画像を再度読み込まないようになっています。FirefoxやSafariとは違った挙動だったので、他に原因があると思って迷走してし
【2015/07/22追記】 現時点の最新版(ver 44.0.2403.89)で確認したところ、表題の問題は解消されておりました。 まだこの問題が確認される場合はChromeが最新版になっていない可能性がありますので、一度ご確認ください。 現時点でのchromeの最新版(ver 43.0.2357.81)から起きているようです。 グローバルナビ等で画像をfloatで横並びにした時、 以下の条件が組み合わさると要素のwidthが0.016px増えてしまうようです。 floatした要素にwidthが設定されていないfloatした要素の最後に空白や改行が入っているfloatした要素のfont-sizeが4の倍数pxになっているデモページを用意しましたでの見てもらうのが一番早いかと思います。 ページのソースを確認してもらうと、どういうことかわかるかと…! 修正方法としましては、floatした要素
Prints useful information to the JavaScript console by enabling the debug version of the Google Analytics Javascript. This extension loads the debug version of the Google Analytics Javascript for all sites you browse using Google Chrome. It prints useful information to the Javascript console. These messages include error messages and warnings which can tell you when your analytics tracking code is
Google Analytics の JavaScript (ga.js) と連携して Google Analytics に情報が送信されないようにします。
自分のIPではなく接続先サーバーのIPを確認できる Chromeで表示しているウェブサイトのグローバルIPアドレスを常に確認したいときにおすすめなのが、Website IP Chrome拡張です。 Website IP - Chrome ウェブストア IPアドレスを表示するための拡張機能はChromeウェブストアに数多く提供されていますが、現在自分が使用しているIPを確認するものがほとんどです。 Website IP Chrome拡張は、自分のIPではなく接続先サーバーのIPを確認できるのが特徴で、ウェブページにアクセスするだけで、自動的にサーバー側のIPをウィンドウ右下に小さく表示します。 Website IP Chrome拡張をインストールしたら、IPアドレスを確認したいウェブサイトを開きましょう。 ウィンドウの右下を見ると、目立たない薄いグレーのボックスにIPアドレスが表示されます。
先月末の話ですのでちょっと乗り遅れ感はハンパないですが、Google Chrome の最新ベータ版、Chrome 34 が公開され、srcset 属性への対応が明らかにされました。 Chrome 34: Responsive Images and Unprefixed Web Audio : Chromium Blog Chrome Browser Beta 去年の夏に Webkit が Nightly Builds で srcset 属性をサポートした時から 議論されていたものが実際に実装されましたというお話。 srcset 属性は、img 要素の属性として使用することで、高精細ディスプレイ (デバイスピクセル比に応じて) 向けや、ディスプレイサイズに応じて画像を出し分けるための属性。所謂、「Responsive images (レスポンシブ イメージ)」 を HTML のみで実現するこ
色々仕込んでたのが全部消えてびっくりしたけど、どうやらChrome 33からユーザー・スタイルシートの機能が削除され使えなくなったようだ。Stylish使うか、ユーザー・スクリプトで強引に仕込むしかない。フォントの書き換えなんかはユーザー・スタイルシートでやりたい……。 ユーザー・スタイルシートを必要とする人が少ないのはわかるんだけど、ドキュメントに直接ではない形でCSSを注入する仕組みはあった方が望ましい気がする。ユーザーによる変更が、ページ制作者に認識できる、しやすい(style要素を数えるだけ)、やろうと思えば削除できるというのはアレな感じする。 Firefoxに舞い戻りたくなるけど、アレなのでWindowsのSafariをもう一回出して欲しい。あ、Opera使えば良いのか。
はじめに chrome extensionsで機能拡張を作るときアイコンをいくつか用意するけどなんかサイズがいろいろあってよくわからん。 合ってるかわからないけど、調べてみたパターンをメモっておきます アイコンパターン サイズ順ではなく用途でまとめてます iconサイズ 用途 サンプル 主に拡張機能そのもの系 48 拡張機能ページ(chrome://extensions)用 manifest.jsonに icons:{48:"icon48.png"} で指定 128 ユーザが拡張機能をインストールする際に使われる? manifest.jsonに icons:{128:"icon128.png"} で指定 32 拡張機能をギャラリーに登録する時用 manifest.jsonに icons:{32:"icon32.png"} で指定 browserAction pageAction系 19 b
ちょっと前(厳密には2012年7月4日?)に Chrome Web Store Team から以下のようなメールが届きました。 Manifest_Version 1: Manifest Version 1 has been deprecated since Chrome 18, and when Chrome 21 hits stable in mid-August the Chrome Web Store will no longer accept new items with manifest_version 1. Converting to manifest_version 2 should be very simple for the majority of developers, and we encourage all developers to update their ex
公式ドキュメント https://developer.chrome.com/extensions/getstarted.html と、日本語の情報はじめてみよう | Chrome Extensions API リファレンスを参考にしてみたことのメモ 日本語で入る情報のページの方は、この記事執筆の現時点では色々と違ってた。 Chromeの設定 Chromeは特にBetaで無くても良いみたい。 いちいち作った拡張機能をインストールとかしなくても良いようにする。 ここから、 の「デベロッパーモード」をONにする。 で、隣の「パッケージ化されていない・・・」から開発中のフォルダを指定。これだけでOK。 manifest.json を作成 とりあえず、サンプルmanifest.jsonをダウンロードして、サンプルicon.pngを持ってきて指定。 これだけで動く。 アイコンクリック時に表示されるHT
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く