- 締切済み
最近ブログなどで画像をクリックすると
ブログ内のサムネイル画像をクリックすると、ページ移動せずに、 そのサイトないにおいてポップアップといいますか、スムーズにその画像のみが表示されるサイトを良く見かけますが、どの様に設定するのでしょか？ さんこうURL： http://ub.blog85.fc2.com/ 等の画像をクリックした場合の表示方法です。 是非、ご教授くださいますようお願い申し上げます。
- 11041104
- お礼率23% (142/607)
- ブログ
- 回答数4
- ありがとう数2
- みんなの回答 （4）
- 専門家の回答
みんなの回答
- Muller3
- ベストアンサー率81% (800/979)
＞「インターネットサイトを開けません」 終了タグなど、どこか文法的に漏れがある（lightbox関係の記述以外でも） Javascriptが干渉しあっている くらいでしょうか。ソースを見ることができないので想像するしかできないです… 私のFC2のテストブログで試してみましたが、他のスクリプトも結構入ってますけど、問題なく動作します。 FC2の助け合い掲示板などで、ソースを見てもらった方が早いかも。 #3で書いたlightbox.cssですが、 #prevLink:hover, #prevLink:visited:hover { background: url(prevlabel.gifのURLをここにいれる) left 15% no-repeat; } #nextLink:hover, #nextLink:visited:hover { background: url(nextlabel.gifのURLをここに入れる) right 15% no-repeat; } です。もれたので一応訂正。
- Muller3
- ベストアンサー率81% (800/979)
パーミッションの設定は不要です。 FC2ブログへの設置だったのですか… ＞その文字列をどう改変したらよいのか lightbox.jsは fileLoadingImage: 'loading.gifのURLをここに入れる', fileBottomNavCloseImage: 'closelabel.gifのURLをここに入れる', lightbox.cssは #prevLink:hover, #prevLink:visited:hover { background: url(prevlabel.gif) left 15% no-repeat; } #nextLink:hover, #nextLink:visited:hover { background: url(nextlabel.gif) right 15% no-repeat; } となります。 そして ・jsフォルダに入っている全てのjsファイル ・lightbox.css ・imagesフォルダのcloselabel.gif、loading.gif、nextlabel.gif、prevlabel.gif たぶんこれだけを、FC2ブログの「ファイルアップロード」使ってアップします。 で、HTMLのヘッダーに…あとは#2参照です。 各ファイルへのパスというか、URLはわかりますよね…？ 念のため書いておきますが、「ファイルアップロード」-「ファイル一覧」の一番左側の「表示」もしくは画像のサムネイルをクリックするとポップアップで表示されますが、そのURLを取得します。
補足
早急なご解答誠にありがとうごいます。 しかいｓ、記載して頂いているように修正しheadタグ内に記載いただいている文字列を、URLへのパスに変更して更新しても、プレビューしても、「インターネットサイトが開けません」となります・・・。(w＿－; ウゥ・・ なぜでしょう(ノ_-;)ハア… コピペしているので、 各URLのパスとjsファイル、cssファイルの改変も間違っていないと思うのですが・・・。
- Muller3
- ベストアンサー率81% (800/979)
lightbox.jsの変更箇所 fileLoadingImage: 'images/loading.gif', fileBottomNavCloseImage: 'images/closelabel.gif', css/lightbox.cssは多分変更しなくても大丈夫だと思うのですが。 画像が×になるんだったら補足してください。 あとはこれを使いたいHTMLのヘッダーに、 <script src="prototype.jsへのパス" type="text/javascript"></script> <script src="scriptaculous.jsへのパス?load=effects,builder" type="text/javascript"></script> <script src="lightbox.jsへのパス" type="text/javascript"></script> <link rel="stylesheet" href="lightbox.cssへのパス" type="text/css" media="screen" /> を入れ、<a>タグに「rel="lightbox"」を追加 lightboxディレクトリ内の構成を特に変えたりしなければ、これでできると思うのですが。
お礼
http://mybraintg.blog47.fc2.com/blog-entry-15.html のサイトを参考に<head>内も追加したところ、 「インターネットサイトを開けません」 と表示されてblog自体が表示されなくなってしまいます。 なぜでしょう・・・？ (ノ_-;)ハア…
補足
アドバイス誠にありがとうございます。 ですが・・・、jsファイルの該当箇所はわかるのですが、その文字列をどう改変したらよいのかわかりません。。。 質問内容に記載しFC2blogにて、あのような表示方法は具体的にどうしたら良いのでしょう(´;ェ;`)ウゥ・・・ ご解答いただいたURLには、パーミッション設定なども記載されていますが、blogにおいてパーミッション設定は可能なのでしょうか？ それとも、別のサーバーにupしてパーミッション設定もしなければNGなのでしょうか？ 何卒、ご教授いただけましたら幸です。m(__)m
- aigaion
- ベストアンサー率47% (287/608)
Lightbox JSというのを使っているみたいですね． 導入方法がやや複雑みたいですので，下のサイトを参考にしてください． Lightbox JS（英語 http://www.huddletogether.com/projects/lightbox/ 日本語で解説しているサイト http://calm.sakura.ne.jp/weblog/log/eid142.html
補足
早急なアドバイスまことにありがとうございます。 しかし、URLをクリックして内容を確認したのですが、現在Lightboxのバージョンが2.04になっていまして、該当URLの様に編集をしようと思ったのですが、編集する場所を検索しても全く同じ文字列がなく・・。 試行錯誤しています。 他にも検索してみたのですが、私が見つけたサイトはv2.0の記述が多く、 DLしたv2.04の.jsファイル、.cssファイル内をどの様に改変したらよいのかがわかりません(w＿－; ウゥ・・
関連するQ&A
- 画像をクリックすると
ランキングサイトに飛ばしたい。 お世話になります。FC2にてブログをやっていますが、 画像（自分の写真等）をクリックさせるとランキングに飛ぶ やり方をお教え下さい。 画像アップでサムネイルで表示させるのはわかるのですが、、、 宜しくお願いします。
- ベストアンサー
- ブログ
- abrobのブログのポップアップする画像はどうなっているんですか
http://www.absorbweb.com/blog/ absorbというグループがありますが、そこのブログに画像をクリックすると画像がポップアップして、画像のサイズが変わりますが、これはどのような処理がされているんでしょうか？これはブログの機能であるんでしょうか？このようなポップアップするような機能を使ってみたいと思っています。
- ベストアンサー
- ブログ
- FC2 クリックポップアップ画像の方法について
http://rgrg.blog61.fc2.com/blog-entry-593.html 画像をクリックすると、そのページ上で画像が大きく表示されるJavaスクリプトツール を上記サイトのとおりやってみましたがポップアップがされません。画像サイズは480X360で、これをクリックすると元画像サイズの640X480をポップアップさせたいのです。 テンプレートは「lightframe_white」にしていますが、ダウンロードし直しても、また他のテンプレートにしてもやはりできません。 <script type="text/javascript"><!-- ： ： <link rel="index" href="<%url>archives.html" title="サイトマップ" /> ポップアップのスクリプトの上にはデフォルトで上記の記載がありますが、この中に改変しなくてはならない行があるのでしょうか？ ご教示の程よろしくお願いします。
- ベストアンサー
- ブログ
- FC2ブログ サムネイル画像
Google・Yahoo等で画像検索をすると、サムネイル表示で検索結果が出ます。 その後サムネイル画像をクリックすると、「FC2 BLOG このページの表示は許可されてません」と表示されます。 拡大画像は表示しない仕組みになっているのでしょうか？ 何か設定があるのかよくわかりません。
- 締切済み
- ブログ
- ブログの画像のサムネイル
私はfc2でブログをやっているのですが 画像をアップロードするときにそのまま記事に表示されるサムネイルはトリミングしたようにして、クリックすると本来の画像がウィンドウで出てくるようにしたいのですが どうすればいいのでしょうか；
- ベストアンサー
- ブログ
- このようなサイトはブログですか？ホームページですか
http://hpmanual.blog81.fc2.com/blog-entry-18.html このようなサイトはブログですか？ホームページですか？ 見た目はホームページだけど、 ＵＲＬには「blog」と入っているし 「ブログ内検索」という窓があります。 でも日付順に表示されてないし、 日記っぽくないのですが、 これはブログなのでしょうか？
- ベストアンサー
- ブログ
- FC2ブログの最新記事を常に表示するURL
一記事単位だと http://ブログ名.blog数字.fc2.com/blog-entry-数字.html ってなってますよね。 これで、そのURLをクリックすると 常に最新記事が表示されるURLってありませんでしょうか？。 これが私のブログの最新記事 http://ブログ名.blog数字.fc2.com/××× って貼りたいんです（貼ったらそのままにしておく）。 なければ、他の案でもいいので教えてください。 よろしくお願いします。
- ベストアンサー
- ブログ
- FC2ブログポータル:サムネイル画像をクリック→元画像が表示されずサムネイル画像が表示されてしまう
私は、以前からPCでfc2blogをやっていました。 最近、auの携帯電話でFC2ブログポータルというサイト （http://blog.fc2.com/ ただしPCからだとPC版表示） から、最近ブログの投稿を始めました。 携帯からＦＣ２に画像を送り、ブログに載せているのですが、そのことで、問題が発生しています。 ************************************************************ （送信の流れ） １．「記事編集画面」で本文などを書き、 「画像をアップロードする」を選択して「保存」を押します。 ２．すると、「投稿完了」との画面。 そこでファイルのアップロードのボタンを押すと、 fc2宛に画像をメールで送るために携帯本体のメール送信画面に 切り替わります。 ３．そこで画像を送信すると、記事投稿完了となります。 ************************************************************ PCや携帯からブログを確認すると、 正常にサムネイル画像は記事中に表示されるのですが、 それをクリックすると、同様にサムネイル画像が表示されてしまうのです。 PCの「過去の記事の管理」画面から、HTMLをみてみると、 <a href="…s.jpg"><img src="…s.jpg" （※…部分は省略） となっていました。両方ともファイルの末尾"s"が付いています。 クリック前の画像と、クリックした後出てくる画像の両方ともサムネイル画像が使用されている状態です。 img srcに"s"が付いているのは良いのですが、a hrefの方は、"s"が付かない元画像になっていないとおかしいはずだと思いました。 確認のため、管理画面で、a hrefの方から"s"をはずすと、画像クリックでちゃんと大きな画像が出てきました。 もちろん、管理画面から毎回修正すれば問題ないのですが、手間がかかるなあと思いまして、なにか解決策がありましたら、教えて頂けないかと思い、質問させて頂きました。 もしかしたら、何か設定ミスでもしているのかも、と思いましたが、すでにどこをどう変えたかもよくわからない状態です。 よろしくお願いいたします。
- ベストアンサー
- ブログ
- Firefox4左下のURLポップアップを消したい
FireFox 4 から出るようになった 左下のURLのポップアップを消したいです http://doheny.blog137.fc2.com/blog-entry-88.html ↑の方法を試しましたが 消えませんでした どうすれば消えますか？
- ベストアンサー
- その他（インターネット・Webサービス）
- ブログ記事上にクリックで画像を表示させたい
livedoor blog Proです。が、PCは初歩です。 505×190の画像を48×18のサムネイルにして記事に貼り、 同サムネイルをクリックすると元の大画像が出ます。 ただし、それが別窓で、なのです。 これを記事上に出す方法をお教え頂けないでしょうか。 あるいは、505×190の<img src=******* />をURL化する方法があれば、 それでも構いません。素人考えですが・・・ AllAboutでLightbox Plusの使い方を読みましたが、分かりません。 それに、どうも違うようにも思えるのです。 よろしく、お願い申しあげます。
- 締切済み
- ブログ
補足
はい。 ありがとうございます。 もう一度、やり直してみます・・・。m(__)m