はてなフォトライフのスライドショーを表示するGoogleガジェットを作ってみた - NAT’s Programming Champloo
はてなフォトライフにアップロードした写真を、はてなダイアリーのサイドバーにスライドショー形式で表示させたいと思ったので、そんなGoogleガジェットを作ってみました。 動作例 しなもんの写真をスライドショー形式で表示させると、こんな感じ。 IEだと、タイトルが日本語が文字化けしてしまうようです(http://i.hatena.ne.jp/idea/16986参照)。現時点ではタイトルを空欄にするか、英字のみ使うかにしておいた方が良さそうです。(対応されたようです) できること 指定された写真をスライドショー形式で、ランダムな順番に表示 タイトルや写真をクリックすると、その写真のページのウィンドウを開く 右下のStart/Stopリンクで、スライドショーの開始／終了を操作 以下のような写真を、スライドショーに表示する写真として指定できる 特定ユーザ(自分でも他人でも可)の写真一覧 人気写真一
はてなフォトライフのスライドショーを表示するガジェットの詳細情報 - NAT’s Programming Champloo
技術的な解説などの覚え書きです。 写真情報の取得方法 ガジェット設定「画像一覧をURLで指定」に指定されたURLのHTMLを読み込み、クラス属性に "foto_thumb" が指定されている<img>を囲んでいる<a>のリンク先URL(href属性)を、写真URLとして取得します。 JavaScriptの実装としては、以下の正規表現にマッチするHTMLを取り出し、<a>のhref属性を写真URLとして記憶します。 /<a href="[a-z_\d\/\.]+"><img class="foto_thumb" src="[a-z_\d\/\.]+" alt="\d+"><\/a>/gi写真を表示するときには、写真URLのHTMLを読み込み、クラス属性に "foto" が指定されている<img>の属性から、必要な情報(src:画像ファイルのURL, alt:タイトル, width:写真の幅,
はてなダイアリーに Flash を埋め込むガジェット - てっく煮ブログ
はてなダイアリーで JavaScript eval に続く、はてなダイアリー向け汎用ブログパーツ第２弾。今回は Flash を埋め込めるようにしてみました。サンプルこんな感じで。サイズも変えられる。使い方こちらからどうぞ。SWF の URL を入力して、サイズ変更して、背景色変更して、「コードを取得」ボタンで貼り付け用のHTMLを取得します。どうぞご利用ください。ソースコードソースは http://nitoyon.googlepages.com/embed_flash.xml。内部で swfobject.js を使っているので、何も考えずに同じ MIT ライセンスで公開。IE6 ではスクロールバー分の余白が表示されてしまったので、document.body.scroll = "no" で特別に対処してます。雑感他のドメインの Flash を埋め込めるので便利。だけど、「無断リンク禁止」な
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
