2

Fancybox を使用して、インライン コンテンツ、想像、iframe を表示しています。これはサイトです:http://marturii-nunta.com.ro/index.php。ユーザーが画像をナビゲートできるようにギャラリーを作成したいのですが、インライン コンテンツに適用する方法がわかりません...アドバイスしてください

これが私のコードです:

<div style="display:none">
    <a id="inline" href="#popup">open</a>
    <div id="popup">
        <table>
            <tr>
                <td><img class="bigpic" src="" width="550px" height="500"/><div id="caption"></div><td>

                <td><iframe width="390" height="490" frameborder="0" scrolling="no" src="form.php"></iframe></td>
            </tr>
        </table>

    </div>
</div>

JS:

<script>
var code = ""; // product code
var caption = "";
$(document).ready(function() {

/* Using custom settings */
$("a#inline").fancybox({

  'scrolling'    : 'no',
  'onComplete'     : function() {
    $('#popup iframe').contents().find('#code').val(code);
     $('#popup iframe').contents().find('#caption').val(caption);

  },
  'titleShow'    : false
});

$(".trigger").click(function() {
  $('#popup img.bigpic').attr('src',$(this).data('href') || $(this).attr('src'));

  $('#popup iframe').attr("src", "form.php"); // on next call this was not set
  code = $(this).data('code');
  caption = $(this).data('caption');
  $('#inline').trigger('click');
});

});
</script>

HTML:

<div class='content_item' id='item_div' style=' width:222px;height:210px' >
            <img src='imagini/".$code.".jpg' id='".$code."' alt='cocarde'  style='width:218px;height:163px' class='trigger' data-caption='".$description[$code]."' data-code='".$code."' data-href='imagini/".$code.".jpg'><br>
            <div style='padding-top:5px'><span class='cod'>".$cod_produs."</span><span class='cod_pret'>".$code."</span></div>
            <span class='pricestyle'><strong>".$pret." ".$price." ".$currency."</span></strong>
            <div>

ありがとう!

4

0 に答える 0