【 配布開始 】ペタクラウドカルーセル
2014.1.24
最新のプラグインはこちらです
＞＞ みけねこカルーセル
【 修正履歴 】
2013.10.15
メッセージの文言とサイズもカスタマイズできるようにしました。
修正履歴は以上！
おもしろプラグインでアメブロをいじり倒すカスタマイズ♪
ども、みけねこ（ニャ～♪）です。
お待たせしました、ペタクラウドカルーセルが配布できるようになりました。
今回は、ペタをつけてくれた人のプロフィール画像をぐるぐる３６０度回しちゃいます。
【 ペタクラウドカルーセル（デフォルト） 】
【 設置方法 】
新ブログデザインで、初めてプラグインを利用する方、または、初めてjQueryを使用する方は、わざめーばさんのこちらの記事を参考に、下準備を行ってください。
＞＞ フリープラグインの先頭ではjQueryを使えるようにしておく
準備ができたら、スクリプトを設置します。
①まず、こちらのスクリプトをフリープラグインに貼り付けてください。
これは、こちらのサイトのスクリプトを利用させて頂きました。
＞＞ Cloud Carousel - Professor Cloud
②次に下記のスクリプトを貼ってください。
③最後に、ペタクラウドカルーセルを設置したい場所に下記のコードを貼り付けます。
フリープラグイン、メッセージボード、フリースペース、サイドバー、記事の中に設置できますが、ページ中に１ヶ所だけになるようにしてください。
【 枠の幅のカスタマイズ 】
枠の幅をカスタマイズする場合は、②のスクリプトの代わりに、下記のスクリプトを貼ります。
旧ブログデザインの場合は、160ピクセルぐらいです。
widthを指定しないで、デフォルトのままだと285ピクセルになります。
【 リフレクション（鏡反射）のカスタマイズ 】
新ブログデザインの場合は、リフレクション（鏡反射）効果をつけることができます。
リフレクション（鏡反射）効果をつける場合は、②のスクリプトの代わりに、下記のスクリプトを貼ります。
リフレクション（鏡反射）効果付き
【 その他カスタマイズ 】
枠の幅、リフレクション効果の他にもスクリプトにパラメーターをつけることによって、カスタマイズが可能です。
②のスクリプトの代わりに下記のスクリプトを貼ります。
色の指定方法はこちらで ＞＞ 色見本（カラーチャート） ナスカ特製
ハッシュコード(#)抜きの文字を指定してください。
【 カスタマイズ例 】
上記のスクリプトを貼るとこのようになります。
リフレクション（鏡反射）効果についてですが、旧ブログデザインの場合、ＩＥ１０では、正しく表示されないようです。
旧ブログデザインにあるこのMETAタグが悪さしてるのかな？
旧ブログデザインでもリフレクションが使えるようになったら、また更新します。
みけねこ（ニャ～♪）でした。
この記事をブログで紹介する
↑このリンク、わざめーばさん作成のツールで作成しました。
わざめーばさんの記事
＞＞ アメブロで紹介記事を書いてもらうリンクを作成できます
【 関連 】
読者様クラウドカルーセル
最新のプラグインはこちらです
＞＞ みけねこカルーセル
【 修正履歴 】
2013.10.15
メッセージの文言とサイズもカスタマイズできるようにしました。
修正履歴は以上！
おもしろプラグインでアメブロをいじり倒すカスタマイズ♪
ども、みけねこ（ニャ～♪）です。
お待たせしました、ペタクラウドカルーセルが配布できるようになりました。
今回は、ペタをつけてくれた人のプロフィール画像をぐるぐる３６０度回しちゃいます。
【 ペタクラウドカルーセル（デフォルト） 】
【 設置方法 】
新ブログデザインで、初めてプラグインを利用する方、または、初めてjQueryを使用する方は、わざめーばさんのこちらの記事を参考に、下準備を行ってください。
＞＞ フリープラグインの先頭ではjQueryを使えるようにしておく
準備ができたら、スクリプトを設置します。
①まず、こちらのスクリプトをフリープラグインに貼り付けてください。
<script type="text/javascript" src="http://www.3kcat.net/p/js/cloud-carousel.1.0.5.js"></script>
これは、こちらのサイトのスクリプトを利用させて頂きました。
＞＞ Cloud Carousel - Professor Cloud
②次に下記のスクリプトを貼ってください。
<script type="text/javascript" src="http://www.3kcat.net/p/pcc.jsp"></script>
③最後に、ペタクラウドカルーセルを設置したい場所に下記のコードを貼り付けます。
<div id="pcc"></div>
フリープラグイン、メッセージボード、フリースペース、サイドバー、記事の中に設置できますが、ページ中に１ヶ所だけになるようにしてください。
【 枠の幅のカスタマイズ 】
枠の幅をカスタマイズする場合は、②のスクリプトの代わりに、下記のスクリプトを貼ります。
<script type="text/javascript" src="http://www.3kcat.net/p/pcc.jsp?width=163"></script>
旧ブログデザインの場合は、160ピクセルぐらいです。
widthを指定しないで、デフォルトのままだと285ピクセルになります。
【 リフレクション（鏡反射）のカスタマイズ 】
新ブログデザインの場合は、リフレクション（鏡反射）効果をつけることができます。
リフレクション（鏡反射）効果をつける場合は、②のスクリプトの代わりに、下記のスクリプトを貼ります。
<script type="text/javascript" src="http://www.3kcat.net/p/pcc.jsp?reflHeight=30"></script>
※赤文字の数字は反射画像の高さ（ピクセル）です。
※赤文字の数字は反射画像の高さ（ピクセル）です。
リフレクション（鏡反射）効果付き
【 その他カスタマイズ 】
枠の幅、リフレクション効果の他にもスクリプトにパラメーターをつけることによって、カスタマイズが可能です。
②のスクリプトの代わりに下記のスクリプトを貼ります。
<script type="text/javascript" src="http://www.3kcat.net/p/pcc.jsp?width=285&reflHeight=30&border-width=6&border-style=ridge&border-color=FF0000&background=000000&text=ペタしちゃったの？&text-size=26&text-color=FFFF00&text-color2=FFFFFF"></script>
width ・・・ 枠の幅(px)
reflHeight ・・・ リフレクション（鏡反射）画像の高さ(px)
0にするとリフレクション効果はなくなります。
border-width ・・・ 枠の太さ(px)
border-style ・・・ 枠の種類
(solid,double,groove,ridge,inset,outset,dashed,dotted)
border-color ・・・ 枠の色
background ・・・ 背景の色
text ・・・ メッセージの文言（指定しなければ「ペタありがとう！」）
text-size ・・・ メッセージのサイズ(px)（指定しなければ18)
text-color ・・・ メッセージの文字の色
text-color2 ・・・ 読者登録してくれた人のニックネームの色
※赤文字の部分をお好みに合わせてカスタマイズしてください。
width ・・・ 枠の幅(px)
reflHeight ・・・ リフレクション（鏡反射）画像の高さ(px)
0にするとリフレクション効果はなくなります。
border-width ・・・ 枠の太さ(px)
border-style ・・・ 枠の種類
(solid,double,groove,ridge,inset,outset,dashed,dotted)
border-color ・・・ 枠の色
background ・・・ 背景の色
text ・・・ メッセージの文言（指定しなければ「ペタありがとう！」）
text-size ・・・ メッセージのサイズ(px)（指定しなければ18)
text-color ・・・ メッセージの文字の色
text-color2 ・・・ 読者登録してくれた人のニックネームの色
※赤文字の部分をお好みに合わせてカスタマイズしてください。
色の指定方法はこちらで ＞＞ 色見本（カラーチャート） ナスカ特製
ハッシュコード(#)抜きの文字を指定してください。
【 カスタマイズ例 】
上記のスクリプトを貼るとこのようになります。
リフレクション（鏡反射）効果についてですが、旧ブログデザインの場合、ＩＥ１０では、正しく表示されないようです。
旧ブログデザインにあるこのMETAタグが悪さしてるのかな？
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
旧ブログデザインでもリフレクションが使えるようになったら、また更新します。
みけねこ（ニャ～♪）でした。
この記事をブログで紹介する
↑このリンク、わざめーばさん作成のツールで作成しました。
わざめーばさんの記事
＞＞ アメブロで紹介記事を書いてもらうリンクを作成できます
【 関連 】
読者様クラウドカルーセル