stroll [名] [C] ぶらぶら歩き,散歩.

  スポンサーサイト

一定期間更新がないため広告を表示しています

- | permalink | - | - | ↑top
Clip!! | Ranking |

  指定したaタグorURLの画像を表示するスクリプトβ

getUrlImageTag

指定したaタグorURLの画像を表示するJavaScriptです。
例えば、こんなことができます。
1.トラックバック元のblogの画像を表示する。
2.コメント投稿者のサイトの画像を表示する。

動作例

このスクリプトでは、Simple API - ウェブサイト・サムネイル化ツール
を利用させていただいてます。
サムネイル生成ツール利用上の注意に、
1ページあたりの新規生成サムネイルが5枚を超える場合、
ページの表示がもたつく
ことがございますので、
動的に表示される検索結果などに組み込む場合は
1ページあたり3〜5枚程度
のご利用にとどめてください。
とありますので、1ページあたり最大5枚まで処理するようにしてます。

設置方法は、以下の通りです。
1.下記のスクリプトを</head>のすぐ上にコピー&ペーストしてください。

<script type="text/javascript">
<!--
// 指定したaタグorURLの画像を表示するスクリプト var.1.0
// by http://melrose.jugem.cc/

// ----------- 変更ここから -----------

// 画像の幅(数値を指定)
var urlImageWidth = 64;

// 画像の高さ(数値を指定)
var urlImageHeight = 64;

// 画像の高さ、幅以外の属性
var urlImageAttribute = 'hspace="5" vspace="5" align="left" border="0"';

// 最大何個画像を表示するか(1〜5の数値を指定)
var urlImageMaxNum = 5;

// ----------- 変更ここまで -----------


var urlImageCount = 0;
function getUrlImageTag(url) {
if (urlImageCount > urlImageMaxNum || urlImageCount > 5) return;
if (url.match(/href="([^"]+)"/i)) {
document.write('<img src="http://img.simpleapi.net/small/' + RegExp.$1 + '" width="' + urlImageWidth + '" height="' + urlImageHeight + '" ' + urlImageAttribute + '>');
urlImageCount++;
}
else if (url.match(/^http(.+)/i)) {
document.write('<img src="http://img.simpleapi.net/small/http' + RegExp.$1 + '" width="' + urlImageWidth + '" height="' + urlImageHeight + '" ' + urlImageAttribute + '>');
urlImageCount++;
}
}
// -->
</script>

// ----------- 変更ここから -----------

// ----------- 変更ここまで -----------
の間の部分を必要に応じて変更してください。

2.画像を表示したい場所に以下のスクリプトを追加してください。
(↓はJUGEMでトラックバック元のblogの画像を表示する場合。)
<script type="text/javascript">
<!--
// 指定したaタグorURLの画像を表示するスクリプト var.1.0
// by http://melrose.jugem.cc/
getUrlImageTag('{trackback_title}');
// -->
</script>

もし、コメント投稿者のサイトの画像を表示したい場合は、
{trackback_title}の部分を{comment_name}に変更してください。

※getUrlImageTag('{trackback_title}');の
{trackback_title}は、以下の2つの文字列のみ有効です。
1.aタグ
  例)<a href="http://melrose.jugem.cc">stroll::blog</a>
  ※各属性値(例の場合http://〜の値)は、" で囲まれている必要があります。
2.URL
  例)http://melrose.jugem.cc


以上です。

っとここまで書いたんだけど・・・
aタグの場合、'(シングルクウォーテーション)が含まれると
JavaScriptでエラーになっちゃうんだよねぇ。。。
getElementByTagNameとかでやってもいいんだけど、処理が遅くなっちゃうし。
設置めんどくさくなっちゃうし。
{trackback_title_url}みたいな出力してくれればいいんだけどなぁ。
うーん。
カスタマイズ(blog) | permalink | comments(8) | trackbacks(0) | ↑top
Clip!! | Ranking |

  スポンサーサイト

- | permalink | - | - | ↑top
Clip!! | Ranking |

  Comment List
おひさしぶりです。
『コメントプレビュー』を設置するついでに設置してみました。
トラバはほとんど来ないんだけども……[:イヤン:]
画像のまわりの枠は消せないのかな?

yucaさん | 2006/04/26 22:52
>>yucaさん
おひさし〜[:ニコッ:]
設置ありがとねん。
>トラバはほとんど来ないんだけども……
なら、コメントの方で[:イヤン:]
>画像のまわりの枠は消せないのかな?
周りの枠は消せないねぇ。。。
画像自体が枠付なのよ。[:はなみず:]

例)
http://img.simpleapi.net/small/http://indecision.jugem.jp/?eid=335
strollさん | 2006/04/27 01:03
>画像自体が枠付なのよ
なるほどね。
では枠ナシはあきらめます[:きれつ:]

コメントにって考えたけど
トラバの方がスッキリ置けるので
このままトラバで地味に使ってみますよ。

じゅげまーに出戻ったのでまたお世話になります[:フッ:]
yucaさん | 2006/04/27 01:39
はじめまして
以前から沢山訪問&利用させて頂いているのに
初めてのコメントであります[:イヤン:]

私好みのスクリプトばかりで
どれを使おうか迷ったあげくすっごく重くなってしまって…
でも、外せないものばかりです[:らぶ:]

これからも素敵なスクリプトを作って下さい
厚かましくもTB-P登録とTBさせて頂きました
ぽんママさん | 2006/04/28 13:39
>>ぽんママさん
はじめまして。
たくさんのスクリプトご利用ありがとうございます。
>これからも素敵なスクリプトを作って下さい
ありがとうございます。
これからもどんどんスクリプトを作って・・・
いきたいんですが、ネタがありません。あせあせ

#ネタ募集中です。。。[:泣き:]
strollさん | 2006/05/02 12:11
はじめまして。
私は今「seesaa」なんですが、ほとんどそのままコピペでサムネイルの表示ができました。ありがとうございました[:はあと:]
rikaさん | 2006/05/02 17:51
http://rakugakiman.blog6.fc2.com/blog-entry-1303.html

他にもこんなサムネイルサービスが登場しましたね。
ちょと遅いですが完全リアルタイムで表示できるようです。
SimpleAPIが表示できないページも表示できるみたいで
便利に使わせてもらってます。
ガイさん | 2006/08/09 15:53
はじめまして。
いつもステキなスプリクト利用させてもらっています。

今回移転して、またこのスプリクトを使用しようと思ったのですが
コメントを書いても、画像が「NOW PRINTING」と出てしまい
表示されなくなってしまいました。
それと、他の方の画像も以前のデザインだったりするのですが
新しいデザインの方で表示はできないのでしょうか?

あと、何個も申し訳ないのですが、画像の高さ、幅以外の属性の
数字を変えても何も変わらなくなってしまいました。
何か良い方法があったら是非お知恵をおかしください。
長々と失礼いたしました。

chiさん | 2006/09/12 02:50

  Comment









  Trackback URL
 

  Trackback
Home  |  Selected Entries  |  Recent Comments  |  Recent Trackback  |  Categories  |  Archives  |  bbs