2

カラーボックスモーダルの外側の背景を透明にしたいのですが。現在、このカラーボックスデモhttp://www.jacklmoore.com/colorbox/example4/のcssスタイルを使用しています。この回答https://stackoverflow.com/a/2760970/233933に基づいて、私は透明なバックグラウンドを行うことができます：

$(".inline").colorbox({inline:true, width:"30%",
    onOpen: function() {
        // make the overlay visible and re-add all it's original properties!
        $('#cboxOverlay').css({
            'visibility': 'visible', 
            'opacity':0.5, 
            'cursor': 'pointer'
        });
        $('#colorbox').css({ 'visibility': 'visible' }).fadeIn(1000);
    }
});

ただし、すべてのカラーボックスモーダルに透明なスタイルを設定したいと思います。colorbox.cssファイルを編集して次のものを含めようとしました。

#cboxOverlay{ visibility: visible; opacity: 0.5 }
#colorbox{ visibility: visible }

しかし、それは何も変わりません。あなたの提案？

更新しました

言葉遣いを更新したので、モーダルの外側を透明にしたいことは明らかです。ありがとう！

4

2 に答える 2

7

試す：

#cboxOverlay{ visibility: visible; opacity: 0.5 !important;}

現在不透明度の設定を上書きするインラインスタイルがオーバーレイに適用されています。

より詳細な説明：を示す#cboxOverlay要素に添付されているインラインスタイル属性がありますopacity:0.9。これはスタイルシートを上書きします。ルールの横に置く!importantと、インラインスタイルを優先して脇に押しやられることはありません。

于 2012-10-24T06:18:16.593 に答える
1

透明な背景（カラーボックス内）の場合、次のように設定する必要があります。 #cboxContent { background: transparent; }

于 2012-10-24T06:18:25.140 に答える