Blog

ブログ

Bing Mapを​レスポンシブ化​対応するには

Bing Mapをレスポンシブ化対応するには

Bing Mapをレスポンシブ化対応する…という、需要がなさそうなお話です。
(ネタはあるけど出せないものが多い。。。というだけです。)

目次

Bing Mapの作り方

Bing Mapを作るときには、アカバスさんの「Bing Maps 簡単組み込み」を使うと、比較的簡単にできます。

まず、「基本設定」で地図のサイズを指定します。
次に。「プッシュピン」で地図上にピンを配置します。

あとは、「コード生成」でコードを作成して、HTMLに組み込みすれば完成です。

Bing Mapのレスポンシブ化

Bing Mapをレスポンシブ化するには、ここから一工夫が必要です。

コードからwidthを削除して、「max-width:100%」を追加指定します。

これでレスポンシブなBing Mapが完成です。
ただ、注意すべき点は、「最初に指定した画像サイズ以上にならない」ということです。

このページを共有

関連記事

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

  1. ワークフローから考えるレスポンシブWebデザイン

    ワークフローから考えるレスポンシブWebデザイン

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

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

  3. Responsive Ecommerceなサイト10選

    Responsive Ecommerceなサイト10選