FC2ブログにLightViewを組み込んでみる

2008年03月06日 00:33

以前から使っていたLightBox2.0とほとんど同じなのですが
最近Webプログラミングもちょこちょこ始めたので
試しに角が丸くなったLightViewでも導入してみようと頑張ってみた。
画像のプレビューが出てくるJavaScriptですね。

さっそくlightbox2.0で編集した内容を思い出して
テンプレートの設定のhtml編集で以下4行をheadに追加します。
<link rel="stylesheet" type="text/css" href="<%url>file/lightview.css" />
<script type='text/javascript' src='<%url>file/prototype.js'></script>
<script type='text/javascript' src='<%url>file/scriptaculous.js?load=effects'></script>
<script type='text/javascript' src='<%url>file/lightview.js'></script>

lightview2.0.2Scriptaculous 1.8.1をダウンロードして解凍します。
Prototype 1.6.0.2を右クリックで対象保存しちゃってください。
lightview2.0.2.zipを解凍後、lightview2.0.2/js/のlightview.jsに手を加えます。
19行目にある
images: '../images/lightview/'

images: '/'
にして保存します。

そしてFC2のアップロード機能を使って、以下のファイルをアップロードします。
・lightview2.0.2/image/lightviewの中の画像全部
・lightview2.0.2/css/のlightview.css
・lightview2.0.2/js/のlightview.js
・scriptaculous-js-1.8.1/src/scriptaculous.js
・scriptaculous-js-1.8.1/src/effects.js
あとprototype-1.6.0.2.jsをprototype.jsとしてアップロードします。

最後にプレビューを使いたいリンクタグにclass='lightview'を追加して終了。
スティで盾とったぞおおおおおおお画像で試してみますとこうなります。
Untitled.jpg

でも動作がすこし重め??Firefoxではスムーズ、IE6,7では少しカクカクな感じ。
まあ本家も同じだったのでそういうものなんでしょう・・・。
javascript初心者がいじったので間違ってたらつっこみをc⌒っ-ω-)っ

○詳しくはこちら
http://www.nickstakenburg.com/projects/lightview/

※IEでは画像が↑のほうに表示されてしまうみたいデス(´・ω・`)

冬到来!

2007年12月09日 11:48

前回のデザイン変更と同じ方の冬テンプレートが
配布されたのでさっそく使ってみました。

その際、私のブラウザはFirefoxを使っているので
今まで気づかなかったんですがどうもIEだと処理が重く感じたので
この差はなんだろうと思って調べてみました。
はっちーはIEだったのかなー。

調査した結果、とあるcssの一文がどうも悪さしてたみたいでこちらを消してみました。
IEだと半透明っぽく見えなくなりましたが処理は少しマシになった気がします。

ということで、Firefoxをお勧め(おぃ

ひさびさのデザイン変更

2007年11月09日 00:00

ログインしようとしたら教授垢きれていてWMもなかったのでポカーンとしていたら
なんとなくサイトのデザイン、その他いろいろ変えようと思い実行しました。

もう秋も終わり冬到来って感じですが・・・。こんな感じに変更してみましたヽ(´ー`)b
同じ作者で冬バージョンもでるそうなので期待してます。
ただ、ちょっとグラフィックが多いので重たい感があるかもしれません・・。
マタ様子みてみます(´・ω・`)

編集画面も新しくなりました(遅
画面エフェクトも新しくなりました(´ー`)
画面全体に表示される感じに。

さらにさらに訪問者リストをひさびさに確認したところSesな方々が!
勝手ながらリンクさせていただきました。
ご都合悪ければ削除します。