SSブログ

画像サムネイルとlytebox [Web / PC / iPhone]

So-net blogがリニューアルして、画像サムネイルの表示が可能になりました\(^^)/

DSCF0007.JPG例えば、[左斜め下]こんな感じです。

画像の設定で「サムネイル画像表示」を利用するように設定し、個々の画像でサムネイル表示時のピクセルを編集すればいいのです。

ただ、これだとオリジナル画像が別ウインドウにて表示されるわけですが、見栄えはスマートでないヽ(゜_゜>)
…と思ってちょっと調べると、リンゴが好きでぃす♪のブログにこんな記事がありました。
Lyteboxを使う方法です。

こんな感じ[右斜め下]になります。
※)ブログ全体を全て読み込まないと、正しく表示されませんー c(`Д´c)
…すみません。重いブログで
[あせあせ(飛び散る汗)]
DSCF0007.JPG設定の仕方は、
  1. Lyteboxをダウンロードして、普段使っている適当なサーバーにフォルダごと保存。
  2. デザイン>HTML編集にある「デフォルトHTML」の<head>部分に、以下のスクリプトを付け加えて別名保存。
    <script type="text/javascript" language="javascript"
     src="(保存したサーバー名)/(lyteboxを保管しているフォルダ名)/lytebox.js">
    </script>
    <link rel="stylesheet" href="(保存したサーバー名)/(lyteboxを保管している
    フォルダ名)/lytebox.css" type="text/css" media="screen" />
  3. 画像に“rel属性"をつける。
    例)<a href="images/image-1.jpg" rel="lytebox">Image #1</a>
Mac OS X(Leopard) + Firefox 2.x/Safari 3.x
及びWindows Xp SP2 + IE7.x
にて動作確認しました(∩.∩)
ちなみに、被写体[猫]は実家にいる妹の愛猫、ラルくんです(=^u^=)ニャウ

人気ブログランキングへ ブログランキング・にほんブログ村へ

ブログ王ランキング トプログ

★imodeBEST100★ ★EZwebBEST100★ ★SoftBankBEST100★

CoRichブログランキング  
nice!(9)  コメント(5)  トラックバック(0) 
共通テーマ:blog

nice! 9

コメント 5

ばなな

なんだか、ブログらしくなくなってしまった気が;;
タグの意味が2種類使われてるし(汗)
カテゴリーっぽいものを、何でタグって表記してんだろう?
うちには、ソースの元のタグしか、わからないっ[あわわ]
あぁ、値札とかのタグも知ってるけど関係ないし…[がーん]
by ばなな (2008-03-01 02:14) 

チヨロギ

これはまたプロっぽい画像表示ですね~[わおっ]
素人のワタクシにはとても踏み込めない領域のようです ^^;

ラルくんはいったいどこに潜りこんでいるのでしょう?
店長の・・・太鼓??[きょと]
by チヨロギ (2008-03-01 15:44) 

Yuseum

>ばななさん、コメントありがとございます[わはっ]
タグはYuseum、無視してますね〜f(^ー^;
タグまで考えていると時間かかるし(・・)(。。)

>チヨロギさん、わりと簡単な操作でプロっぽく見えますよ[にこっ]
ラルくんは、たぶんお店の紹介雑誌の下に潜り込んでるのかな[はてな]
「店長の太鼓判」というわけです( ・∀・)イイ!!
by Yuseum (2008-03-03 05:02) 

ぴょん太

下のラル君をクリックして、意味がわかりました!(画像サムネイルって何だろう?って思ってました。)
 表示のされ方が、スマートですねぇ。挑戦してみたいものの・・・もう少しお勉強が必要なようです(ポリポリ)。
ありがとうございます!一つ利口になったので、これはもう、Nice!です。
by ぴょん太 (2008-03-04 17:06) 

Yuseum

ぴょん太さん、nice!ありがとございます[わはっ]
この方法は、なかなかキレイですね(∩.∩)
by Yuseum (2008-03-05 05:48) 

コメントを書く

お名前:[必須]
URL:
コメント:
画像認証:
下の画像に表示されている文字を入力してください。

Facebook コメント

トラックバック 0

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。