リンク先をサムネイルで・・・ Link Thumbnail
リンク先のサムネイルをマウスオーバーでポップアップ表示します
※このスプリクトを利用するためにはファイルを置くための外部サーバーが必要です
あまり使い道がないような気が・・・・
それに外部にファイルを置かないとですから
お勧めしません
トライしたい方は・・・・
Link Thumbnail ←マウスを乗せるとリンク先のサムネイルが・・・・
このての中では1番設置が簡単ではないかな・・・・
ダウンロードしてきた linkthumb.zip を解凍すると
arc90_linkthumb.js 、 example.html 、linkpic_shadow.gif の3つのファイルが現れます
このうち example.html は 必要ないです
linkpic_shadow.gif これはサムネイルの影の画像ですがサイズが合わないので気になる方は作り直した方が
arc90_linkthumb.js 、linkpic_shadow.gif の2つを外部サーバーにアップします
(linkpic_shadow.gif はアメブロの画像フォルダーにアップでもかまいません)
フリープラグインに
<script type="text/javascript" src="arc90_linkthumb.jsのURL"></script>
CSSに
.arc90_linkpic {
display: none;
position: absolute;
left: 0;
top: 1.5em;
}
.arc90_linkpicIMG {
padding: 0 4px 4px 0;
background: #fff url(linkpic_shadow.gifの画像のURL) no-repeat bottom right;
}
サムネイルを表示したい<a>タグに class="linkthumb" を記入します
・・・がすべてにリンクにサムネイルが表示されるわけではありません
現在設置してあるのは
ニンブロラボ. 外部リンクのサムネイルをMozshotで を参考に変更しています
少し手を入れて
function arc90_linkpic() {
var b = document.domain;
↓
function arc90_linkpic() {
var b = "http://hama-sush-jp.pro/exlink/ ";
アメブロ以外のリンクしか表示されなかったのを
自分以外のアメブロを使われている皆さんのブログも表示されるようにしてみました
右サイドの読者さまの上にマウスを乗せてみてください
コメントのお名前部分でも表示されます
コメントいただいた方のブログのサムネイルが表示されると感動物です
・・・現在のブログを読み込んで表示しますので時間がかかる場合もあります