-1

私は助けが必要です。写真を表示するファンシーボックス内で、Facebookコメントソーシャルプラグインを使用した画像ショーの横で多かれ少なかれ試してみました。

fancyboxオプションのJavascript内に、

$(".fancybox").fancybox({
 padding: 0,
    modal: true,
        helpers: {
        thumbs : {
                    width  : 50,
                    height : 50
                },
        buttons: {},

        },

    afterShow: function(){
        var descripcion = "<div class='texto1'><p>TEXTO1</p></div>"
        var comentarios = "<div class='texto2'><p>TEXTO2</p></div>;"
        $('#fancybox-overlay').append(comentarios);
        $('#fancybox-overlay').append(descripcion);

    },
    nextEffect: 'fade',
    prevEffect: 'fade'
});

問題は、オーバーレイに2つのものを一度に表示させないことです。どちらか一方だけです...：Sには解決策があるので、両方を表示できますか？前もって感謝します

4

2 に答える 2

0

私があなたがそれが何をすることを期待しているのかをはっきりと理解しているなら：

afterShow: function(){
    var descripcion = '<div class="texto1"><p>TEXTO1</p></div>';
    var comentarios = '<div class="texto2"><p>TEXTO2</p></div>';
    $('#fancybox-overlay').append(descripcion, comentarios);
}
于 2012-10-31T16:30:58.897 に答える
0

構文エラーに注意してください...次に、ラッパーを作成して、新しいテキストをfancybox内に挿入できます。

<div class='wrapText'></div>

...正しく配置するためのスタイルがあります

.wrapText {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1100;
    color : #fff;
}

beforeShow...次に、コールバックを使用してfancyboxコンテンツの前に追加します

$(".fancybox").fancybox({
    beforeShow: function () {
      var descripcion = "<div class='texto1'><p>TEXTO1</p></div>";
      var comentarios = "<div class='texto2'><p>TEXTO2</p></div>";
      $("<div class='wrapText'>" +descripcion+comentarios+ "</div>")
        .prependTo( this.inner );
    }
});

それが機能しているのを見てください

于 2012-10-31T18:56:29.923 に答える