ปรับขนาดความสูง iframe ของ fancybox v2

มีวิธีทำให้สคริปต์ด้านล่างใช้กับ iframe ใน fancybox เพียงอย่างเดียวหรือไม่ ฉันมีเพจที่มีทั้งแกลเลอรีและ iframe ฉันต้องการให้ iframe มีความสูงต่างกันโดยไม่กระทบต่อขนาดรูปภาพ

$('.fancybox').fancybox({
afterLoad: function () {
    this.width = $(this.element).data("width");
    this.height = $(this.element).data("height");
}
});

person Jan    schedule 07.04.2014    source แหล่งที่มา


คำตอบ (2)


คุณสามารถกำหนดเงื่อนไขเพื่อตรวจสอบความถูกต้องของเนื้อหา type ก่อนที่จะส่งค่า data-* ไปยัง fancybox เช่น :

$(".fancybox").fancybox({
    afterLoad: function () {
        if (this.type == "iframe") {
            this.width = $(this.element).data("width");
            this.height = $(this.element).data("height");
        };
    }
});

JSFIDDLE


คุณยังสามารถอ้างถึง $(this) เช่น this.element

$(".fancybox").fancybox({
    afterLoad: function () {
        if (this.type == "iframe") {
            this.width = this.element.data("width");
            this.height = this.element.data("height");
        };
    }
});

JSFIDDLE

person JFK    schedule 07.04.2014

รหัสนี้ใช้งานได้สำหรับฉัน!

$.fancybox.open({
        maxWidth: 1263,
        // fitToView: true,
        width: '90%',
        // maxHeight: 292,
        autoSize: false,
        closeClick: false,
        openEffect: 'elastic',
        closeBtn: true,
        closeEffect: 'elastic',
        href: '/team/' + $(this).data("cv") + '_team.html',
        type: 'iframe',
        'afterShow': function() {
          $(".fancybox-wrap").height($(".fancybox-iframe").contents().find("html").height() + 30);
          $(".fancybox-skin").height($(".fancybox-iframe").contents().find("html").height());
          $(".fancybox-inner").height($(".fancybox-iframe").contents().find("html").height());
        }
    });
person r1si    schedule 30.06.2015