
http://fancyapps.com/fancybox/#examples
このサイトを参考にして、
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
------------追加した部分------------
$(".fancybox")
.attr('rel', 'gallery')
.fancybox({
padding : 0
});
------------------------------------
</script>
と</head>の上に書いたのですが、白枠が残っています。
フォルダはほぼそのまま入れて、fancybox自体は挙動するのでリンクも間違っていないはずです。
htmlは
<a class="fancybox" rel="group" href="images/1_b.jpg"><img src="images/1_s.jpg" alt="" /></a>
<a class="fancybox" rel="group" href="images/2_b.jpg"><img src="images/2_s.jpg" alt="" /></a>
です。
念のためgalleryをgroupにしたり、paddingをmarginにしてもダメでした。
何が問題なのでしょうか?ご教示お願い致します。
No.2ベストアンサー
- 回答日時:
ANo1です。
回答してから気付きました。
backgroundをtransparentにするのが一番簡単かも。
回答ありがとうございました。
cssでカスタマイズできるものでも、はじめから自分が書いたものでないと戸惑ってしまうことが多いです。大変参考になりました。
No.1
- 回答日時:
よく知りませんけれど、サンプルをちょこっと覗いてみたところ・・・
fancyboxのポップアップの表示要素は
<div class="fancybox-skin">
<div class="fancybox-outer">
<div class="fancybox-inner">
<img class="fancybox-image" alt=""> ← 表示画像
</div>
</div>
</div>
といった構成になっているようです。
余白を作っているのは、このうちのfancybox-skinにpadding:15pxと指定されていることによりますので、そのあたりを調整してあげる必要があります。
クローズ用の×印がさらに外側の要素で
<a class="fancybox-item fancybox-close">
で定義されているようですが、このレイアウトによってさらに外側の要素で右側に余白状のものが残る可能性があります。
position:absoluteなどに変えて表示するようにする必要があるかもしれませんね。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Javascript初心者|jQueryの.va...
-
ボタンを押すたびに交互に切り...
-
背景色と連動するスライドショ...
-
fancyboxのポップアップ時の画...
-
ホームページ作成で画像スクロ...
-
MAX関数を使ってからLEFT JOIN...
-
c++std::string型をTCHARに変換...
-
javascriptテキストBOX色を元に...
-
removeEventListenerについて
-
CSSで背景を下までのばすには?
-
jspでcssが読み込めない
-
ネストされたチェックボックス...
-
ダイアログから画像ファイルは...
-
【jQuery】2分割レイアウトで、...
-
MFCで画像を表示させているので...
-
ウィンドウサイズを無視して、D...
-
JSPでの画像ファイル表示
-
error LNK2019 未解決のシンボ...
-
displayの状態を取得したい
-
表示・非表示のスクリプトで、...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
jQueryで同じクラス名のものを...
-
Javascript初心者|jQueryの.va...
-
デフォルト非表示にしたい。【t...
-
javascript ランダム表示
-
ホームページ作成で画像スクロ...
-
JavaScript - 月ごとに画像変化
-
HTMLへ要素の挿入について
-
animateを使用したマウスオーバ...
-
IMGタグごとにCSSを設定する方法
-
一定時間で入れ替わるバナー画...
-
embed要素のsrc属性の値を変更...
-
アニメーションをループさせたい
-
jqueryを使用した画像スクロー...
-
clear機能を失わずにファイルア...
-
jQueryでセレクタに複数のIDを...
-
イラストのボタンを押したとき...
-
吹き出しに画像とコメントを入...
-
セレクトボックスで、リンクバ...
-
Jquery cheeckbox(複数)とsli...
-
複数bxsliderをタブで切り替え...
おすすめ情報