FacebookのPagePlugin版Like Boxの幅を動的に変える方法

情報をウォッチしていなかった私が悪いんですが、廃止告知から廃止まで3ヶ月って酷くないですかFacebookさん。
それとも、もっと前に告知ありました??

Facebook謹製LikeBoxが廃止となり、あたらしくPage Pluginを使えということになりました。
↓ココから取得できます。
https://developers.facebook.com/docs/plugins/page-plugin

見た目はこんな感じ。
(さらに…)

IE8でjQueryというかJavaScriptが動かない。

思い出したのでメモ。

とあるお仕事で管理画面を作成しました。
画面遷移させたくなかったので、画像の登録をポップアップしたウィンドウ内で行うようにしていたところ。
IE8で動作しないとクレームが。

同じような動作をさせている箇所が複数あるのに、とある機能だけポップアップするものの内容が表示されない。
※ちなみにポップアップに使用したのはjQueryプラグインの「prettyPopin」。

エラーログを見てみると「エラー 80020101」とあるのでぐぐってみると…。

来ましたコレ。
JavaScriptの動かないコード (中級編) Ajax読み込み時に「80020101」のエラー – 主に言語とシステム開発に関して

いわく

IE6,IE7では,Ajaxで読み込まれるページのJavaScriptが

<script type=”text/javascript”>
<!–
~~
//–>;
</script>

のように丁寧にコメントアウトされていると,

80020101のため操作を完了できませんでした

のエラーが表示される。

エラーの起こっているコードみたら…コメントアウトしてた…。
で、エラーの起こってないコードを見たら…コメントアウトしてない。

なんの罰ゲームですかコレ。
しかもIE8でも再現してますやん。

で、ためしにコメントタグを消してやると…。
ちゃんと動きましたよ…。

レスキューしていただいたページの最後のコメントが…。

ちなみにFirefoxでは,前者の記法でも正常に動く。Firebugも何も言わない。

これは,かなりはまる。

まさに…。どっぷりハマりました。
このエントリーがなかったら解決できていたかどうかかなり怪しいです。

ありがたやありがたや。

リストをクリックしたら情報ウィンドウを表示する[jQuery]+[GoogleMapsAPIVersion3]

途中別のことをやっていて時間が空いてしまいましたが、GoogleMapsAPIです。

前回までは以下の通り。

  1. 地図の表示と緯度経度の取得[GoogleMapsAPIVersion3]
  2. マーカーと情報ウィンドウの表示と削除[GoogleMapsAPIVersion3]
  3. XMLを読み込んでマーカーを表示する[jQuery]+[GoogleMapsAPIVersion3]
  4. 表示されているマーカーのリストを表示する[jQuery]+[GoogleMapsAPIVersion3]

残る仕様はひとつ。

  • リストに表示された名前をクリックしたら、該当地点のマーカーのふきだしが表示されます

これ少しハマりました。
jQueryのところで。
わかってしまえばなんともないんですけどね。
(さらに…)

表示されているマーカーのリストを表示する[jQuery]+[GoogleMapsAPIVersion3]

前回までは以下の通り。

  1. 地図の表示と緯度経度の取得[GoogleMapsAPIVersion3]
  2. マーカーと情報ウィンドウの表示と削除[GoogleMapsAPIVersion3]
  3. XMLを読み込んでマーカーを表示する[jQuery]+[GoogleMapsAPIVersion3]

Googleさんと先人のおかげで、マーカーと情報ウィンドウまでサクサクと出来ました。
残る仕様は二つ。

  • 現在表示されている地点データの名前を、地図の外にリストとして表示します
  • リストに表示された名前をクリックしたら、該当地点のマーカーのふきだしが表示されます

今回は「現在表示されている地点データの名前を、地図の外にリストとして表示します」の方をかたづけます。
これもjQueryを使えばすごく簡単。
(さらに…)

XMLを読み込んでマーカーを表示する[jQuery]+[GoogleMapsAPIVersion3]

前回までは以下の通り。

  1. 地図の表示と緯度経度の取得[GoogleMapsAPIVersion3]
  2. マーカーと情報ウィンドウの表示と削除[GoogleMapsAPIVersion3]

地図、マーカー、情報ウィンドウが表示できたら、地点情報XMLを読み込んで該当する地点にマーカーを表示させます。
完成まであと一歩といった感じでしょうか。

XMLを読み込む

XML読み込み部分を作ります。
その前に、XMLがなければどないしようもないので、以下のようなサンプルXMLを用意しました。
単純に地点の名称と、緯度経度のXMLデータです。

sample.xml

さて、肝心の読み込みですが、さっと調べてみるとjQueryが便利そうなのでコイツを使います。
jQueryは他にも色々な用途で使えるので、遅かれ早かれ導入することになるでしょう。
(さらに…)