Blog

ブログ

Chromeに​User-Agent-Switcherが​いつの間にかあったので​使ってみたよ

ChromeにUser-Agent-Switcherがいつの間にかあったので使ってみたよ

いつもお世話になっている[謎].net Magezineの記事より。
33 fantastic Chrome extensions | Feature | .net magazine」という記事を読んで、「User-Agent-Switcher」という機能がChromeにもあることを知ったので調べてみました。

目次

レスポンシブWebデザインに使える便利機能?

コンテキストメニュー(右クリックメニュー)の「要素の検証」をクリックするとDeveloper Toolsが開きます。その右下のギアマークをクリックすると黒いモーダル画面が現れます。
いままでこの設定を知りませんでした。

「General」「Overrides」「Shoutcuts」の3つのタブがあります。

「Overrides」タブに便利なものが詰まっています。

  • 「User Agent」を変更できます。
  • 「Device metrics」でスクリーンサイズ(Screen resolution)を変更することができます。
  • 「Emulate touch event」でタッチイベントをエミュレートすることができます。

「Device metrics」でのUser Agentには、IEなどおなじみのブラウザに加えてBlackberryなどのブラウザもエミュレートできます。

現在、iOSやAndroidなど、Webkitが使われるモバイルブラウザが主流になっています。同じWebkitを使うChromeにこのような便利な機能がついているのはありがたいと思います。

このページを共有

関連記事

この記事を読んだ人はこの記事も読んでいます

  1. Responsive Ecommerceなサイト10選

    Responsive Ecommerceなサイト10選

  2. レスポンシブ・タイプセッティング対応、スクロール時に指定位置で要素を固定させるjQuery/Zeptoのコードを書いてみた

    レスポンシブ・タイプセッティング対応、スクロール時に指定位置で要素を固定させるjQuery/Zeptoのコードを書いてみた

  3. 「remを利用したスケーラブルなレスポンシブWebデザイン」・「日本語Webフォント」などを採用してサイトをリニューアルしました

    「remを利用したスケーラブルなレスポンシブWebデザイン」・「日本語Webフォント」などを採用してサイトをリニューアルしました