使いやすいのかどうかも見るために使ってみることにした。設定の仕方や注意点なども書いておいたので参考にしてください。設定その1ここでは主に表示される部分の枠や画像の設定。dimensions表示させる枠のサイズ。autoplaytrueなら自動でスライドショー開始。persisttrueなら最後に見た画像を記憶しておく。falaseなら記憶しない。pause一枚の画像が表示されている時間。fadeduration画像の切り替え時のフェードイン・アウトにかかる時間。panelパネルのCSS設定。heightが高さ、opacityが透明度(0が透明)、paddingTopがコントロール画像のパネル上部からの位置、fontStyleが枚数表示の文字部分・・・となる。images画像のURLの指定。保存場所にあわせて画像の保存場所を指定する。imageSpacingコントロール画像の位置調整。offsetTopはパネル上からの位置、spacingが画像同士の左右の間隔。slidedurationパネルが表示されるまでの時間を設定。使用する際の注意点&覚えておく方がいいことこのプラグイン、かなり簡単に使える!ってことがわかったが、ちょっとだけ注意することがあった。覚えておいたほうがいい点もいくつかあったので書いておく。最後の指定部分の末尾にはコンマをつけないこと。コンマをつけてしまうと、IEで表示されなくなるので注意が必要。基本的に配列の最後にコンマつけるとIEでエラーなので、このプラグインだけじゃなく、いろいろなところで注意です。IE6で後方互換モード時のボーダーとパネルが重なるこれは個人的に一番の落とし穴だったと思う。後方互換モードだとボックスのレンダリングが少し変わるから、ボーダーも指定の枠内に入ってしまう。すると、マウスを乗せた時の下からでてくるコントロールパネルがボーダーと重なってしまうことになってしまう。xml宣言している場合などは要注意。ちなみに上で表示しているサンプルもIE6で見ると重なっている。回避方法は標準準拠モードにしておくか、もしくはボーダーを使わないのどちらかだろう。一応対応がIE7+になっている。このモードさえ違わなければIE6でも大丈夫ですけどね。画像のサイズに注意もう一つ気をつけていたほうがいいのは画像のサイズ。サイズ指定をする欄があるが、そのサイズはあくまで枠の大きさ。表示される画像は元の大きさのまま表示されてしまう。枠の大きさが画像よりも大きい場合は背景黒く表示される。画像の大きさにあわせて指定するように。ちなみに左が横幅で右が縦幅の大きさ指定になる。配布元の解説でデフォルト設定で入っているけど、これは別になくてもいいっぽい。はずしても問題なく表示された。darkred;}指定さえできれば簡単に表示される。設定さえできたらCSSの設定も特になく表示することが出来る。CSSの面倒な設定が必要ない分、とっても楽なギャラリーになる。シンプルなのになんて簡単なんだ!僕もこういうのを作れるようになりたいものです。TrackBack(0)この記事へのコメントはじめまして。simplegalleryを設置してみたのですが分からないことがあり調べていたらこちらにたどり着きました。初歩的なことかもしれませんがご教授いただければ幸いです。私共HPのサーバーに設置するとNEXTやPLAY等のGIF画像に正しく表示されません。縦に並び、左端に位置しています。画像もちゃんと表示されずDLする前のサイトで表示されている画像のままです。黒ベースに白い矢印マークになりません。説明不足でお分かりにならないかもしれませんがどうぞ解決策をお教えください。2009年11月12日>デュレさんコメントありがとうございます。んー、環境とかどのような設定にしたなどのソースがないので、どういう状況なのかわからないので、せめてコードと、どのブラウザでみたときの崩れなのかというのがわかればもう少しアドバイスできると思います。・CSSはきちんと適用しているか?#simplegallery1{}の部分もつけて、それがきちんとついているか、Firebugなどでチェックしてみたほうがいいと思います。relative;が必須になります。・画像が元のサイトのままなのは、JSのソースで、指定が元サイトのままだからだと思います。""]],ここの部分、修正していますでしょうか?もしよろしければ、現状設定しているコードなど、メールいただくか、ここに再度かいてもらえたらと思います。[必須入力]※画像の中の文字を半角で入力してください。reserved.×この広告は180日以上新しい記事の投稿がないブログに表示されております。