Home > スポンサー広告 > Greybox実装手順


スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

 Comments:-

リア URL 2008-03-30 (日) 10:11

FC2Blogの仕様?上、日本語がまったく含まれていないhtmlファイルはアップロードできないため、何かしら日本語を含めてアップロードする必要がある。

これに悩んでいる厨です。
具体的にはどうするのでしょうか ?

TomomiX URL 2008-03-30 (日) 13:07

>リアさん
こんにちわ。質問ありがとうございます。
ダウンロードしたファイルのままだとアップロードできません。
よって、<body>~</body>内に以下のような記述を追記します。
<span style="display:none;">あああああ</span>
これでアップロードできるはずです。

リア URL 2008-04-01 (火) 22:47

どうも私のスキルではhtmlファイルのアップロードまでもいっていない事を痛感いたしました。
もう少し腕を上げてからgreyboxに挑戦する事にします。
親切に教えていただいてありがとうございます。

TomomiX URL 2008-04-01 (火) 23:00

いえいえ、ご連絡いただきこちらこそありがとうございます。
実装する際に不明点ありましたらどしどし質問くださいね。
わかる範囲で回答しますので、よろしくお願いします。

aco_oca URL 2008-05-28 (水) 21:51

GleyboxをDLして作成してみたのですが、スライドショーとして次に進むようクリックで進みたいのですが、リンクが反応せず、×で閉じなければいけない状態です。

どうすれば、これを次々に進むスライドショーにすることができるのでしょうか?

教えて下さいませ。
よろしくお願い申し上げます。

PS
shadowboxカッコイイですね。
写真や作品集をのっける仕様で
使えないですかねぇ?

aco_oca URL 2008-05-28 (水) 22:00

shadowboxのページを見ていたら、のっておりました。

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
赤文字部分のShadowboxを扱うrel属性に[]を使うことでグループ化できます。
※[]内の文字はユニークで良いが、グループ化するには同じ文字を入力ください

rel="gb_imageset[1]
とやったところ、見事スライドショーになりました!

greyboxは、Flash(swf)などは
のっけられないのでしょうか?
ちょっと、やってみて無理そうならShadowboxにしようかな。
と思います。

ありがとうございます。
ブログ、参考にさせて戴きます。

TomomiX URL 2008-05-28 (水) 23:25

aco_ocaさん
こんばんわ^^

>写真や作品集をのっける仕様で使えないですかねぇ?
→使えると思います。実際に私も水族館で撮った複数の写真をスライドショーライクにしてみましたv-398

>greyboxは、Flash(swf)などはのっけられないのでしょうか?
→Greyboxも動画系に適用できるみたいですが、未検証です。Highslide JSを実装したと同時にjsが競合し動作しなくなったため、同様のことができるShadowboxを実装しました。今度Shadowboxで動画を適用する方法を掲載したいと思いますv-392

なので、現在は・・・
単一のサムネイル画像やスクリーンショット系は、Highslide。複数の写真をスライドショー的に見せるのは、Shadowbox。という風に運用したいと思っています。

Comment Form

 Trackback+Pingback:-

TrackBack URL for this entry
http://blackcat13numbers.blog31.fc2.com/tb.php/108-893f993a
Listed below are links to weblogs that reference
スポンサーサイト from TRASH
Trackback from TomomiX日記・Windows&Mac関連フリーソフト・オススメソフト紹介ブログ「TRASH」 2008-03-29 (土) 02:46

Greybox:画像もWebも格好良く表示するLightbox進化版

Greybox フォルダアップロードできないFC2blogでは諦めかけていたGreyboxだが、実装に無事成功しました。実装方法は以下の別記事で記載しました。 ... (more…)

Home > スポンサー広告 > Greybox実装手順

Home > IT Tips > Greybox実装手順


Greybox実装手順

○実装手順
1.Greybox公式サイトへ移動
2.Greybox最新版をダウンロード
3.解凍し、greyboxフォルダ直下のファイルをすべてアップロード
4.以下を <head>~</head> 間に記述

<script type="text/javascript">
var GB_ROOT_DIR = "http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/";
</script>

<script type="text/javascript" src="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/AJS.js"></script>
<script type="text/javascript" src="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/AJS_fx.js"></script>
<script type="text/javascript" src="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/gb_scripts.js"></script>
<link href="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/gb_styles.css" rel="stylesheet" type="text/css" />
です。

FC2ブログの仕様上、フォルダアップロードができないため、必要なファイルをすべて1つずつアップロード。中身は上記のjsファイル3つとcssファイル1つと、その他gifファイル6つとhtmlファイル1つ。アップロードしたときのURLをすべて指定しています。

そして、前準備が終わり、次は画像とWebページに付加する <a> タグの属性です。
それぞれ、赤文字部分を追記。
※変な改行が入りみづらくなりましてすみません。
<a href="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/20080203_1.jpg" rel="gb_image[]"<img src="http://blog-imgs-29.fc2.com/b/l/a/blackcat13numbers/20080203_1s.jpg" alt="20080203_1.jpg" border="0" align="left"/></a><br clear="all" />
と記述すると
20080203_1.jpg
<a href="http://www.google.co.jp/" rel="gb_page[500, 500]" title="Google">Google</a>
と記述すると
Google
※サンプル画像とリンク先が「Page not found」とでてしまう場合
→htmlファイルのアップロードがうまくいかず(日本語がファイル中身に含まれていなかったため)正常にアップロードしたら、実装完了しました。FC2Blogの仕様?上、日本語がまったく含まれていないhtmlファイルはアップロードできないため、何かしら日本語を含めてアップロードする必要がある。
スポンサーサイト

 Comments:7

リア URL 2008-03-30 (日) 10:11

FC2Blogの仕様?上、日本語がまったく含まれていないhtmlファイルはアップロードできないため、何かしら日本語を含めてアップロードする必要がある。

これに悩んでいる厨です。
具体的にはどうするのでしょうか ?

TomomiX URL 2008-03-30 (日) 13:07

>リアさん
こんにちわ。質問ありがとうございます。
ダウンロードしたファイルのままだとアップロードできません。
よって、<body>~</body>内に以下のような記述を追記します。
<span style="display:none;">あああああ</span>
これでアップロードできるはずです。

リア URL 2008-04-01 (火) 22:47

どうも私のスキルではhtmlファイルのアップロードまでもいっていない事を痛感いたしました。
もう少し腕を上げてからgreyboxに挑戦する事にします。
親切に教えていただいてありがとうございます。

TomomiX URL 2008-04-01 (火) 23:00

いえいえ、ご連絡いただきこちらこそありがとうございます。
実装する際に不明点ありましたらどしどし質問くださいね。
わかる範囲で回答しますので、よろしくお願いします。

aco_oca URL 2008-05-28 (水) 21:51

GleyboxをDLして作成してみたのですが、スライドショーとして次に進むようクリックで進みたいのですが、リンクが反応せず、×で閉じなければいけない状態です。

どうすれば、これを次々に進むスライドショーにすることができるのでしょうか?

教えて下さいませ。
よろしくお願い申し上げます。

PS
shadowboxカッコイイですね。
写真や作品集をのっける仕様で
使えないですかねぇ?

aco_oca URL 2008-05-28 (水) 22:00

shadowboxのページを見ていたら、のっておりました。

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
赤文字部分のShadowboxを扱うrel属性に[]を使うことでグループ化できます。
※[]内の文字はユニークで良いが、グループ化するには同じ文字を入力ください

rel="gb_imageset[1]
とやったところ、見事スライドショーになりました!

greyboxは、Flash(swf)などは
のっけられないのでしょうか?
ちょっと、やってみて無理そうならShadowboxにしようかな。
と思います。

ありがとうございます。
ブログ、参考にさせて戴きます。

TomomiX URL 2008-05-28 (水) 23:25

aco_ocaさん
こんばんわ^^

>写真や作品集をのっける仕様で使えないですかねぇ?
→使えると思います。実際に私も水族館で撮った複数の写真をスライドショーライクにしてみましたv-398

>greyboxは、Flash(swf)などはのっけられないのでしょうか?
→Greyboxも動画系に適用できるみたいですが、未検証です。Highslide JSを実装したと同時にjsが競合し動作しなくなったため、同様のことができるShadowboxを実装しました。今度Shadowboxで動画を適用する方法を掲載したいと思いますv-392

なので、現在は・・・
単一のサムネイル画像やスクリーンショット系は、Highslide。複数の写真をスライドショー的に見せるのは、Shadowbox。という風に運用したいと思っています。

Comment Form

 Trackback+Pingback:1

TrackBack URL for this entry
http://blackcat13numbers.blog31.fc2.com/tb.php/108-893f993a
Listed below are links to weblogs that reference
Greybox実装手順 from TRASH
Trackback from TomomiX日記・Windows&Mac関連フリーソフト・オススメソフト紹介ブログ「TRASH」 2008-03-29 (土) 02:46

Greybox:画像もWebも格好良く表示するLightbox進化版

Greybox フォルダアップロードできないFC2blogでは諦めかけていたGreyboxだが、実装に無事成功しました。実装方法は以下の別記事で記載しました。 ... (more…)

Home > IT Tips > Greybox実装手順

Recent Comments
Recent Trackback
Feeds

↑Page Top

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。