开发者

jquery simplemodal 1.4.1 dynamic height - viewport toolbar bloat

开发者 https://www.devze.com 2023-02-20 15:09 出处:网络
Please could kindly give me a bit of advice? I have a problem with scrollbars going awry! I’ve tried my concept in a variety of browsers before realising that I was suffering a viewport problem and t

Please could kindly give me a bit of advice? I have a problem with scrollbars going awry! I’ve tried my concept in a variety of browsers before realising that I was suffering a viewport problem and toolbar bloat!

Basically my line of attack is to try and dynamically change the height 开发者_如何学Cof the simpleModal.container based on the viewport size and then pray that the 2nd scroll doesn’t appear! [i.imgur.com/EPFU8.jpg]

I’m using the simpleModal 1.4.1 plugin + jquery 1.4.2 and the script code that I’m authoring below is what I’m floundering with.

The height of my HTML content isn’t really a fixed size. In respects of the content I’ve got a height: 100% on the htmldoc & body for the interior container + iframe contents.

$j(document).ready(function() {

$j('a.popup').click(function() {
  var src = $j(this).attr('href');
  // Dynamically adjust height comparative to available viewport.
  var h = $j(window).height()-100+'px';

  $j.modal('<iframe id="dialog-frame" scrolling="auto" frameborder="0" src="' + src + '"></iframe>',
    { onOpen: modalOpen($j('#simplemodal-container')), onShow: $j('#simplemodal-container').css('height', 'auto'), overlayClose: true, persist: true, minHeight: "720px", containerCss: { height: h } });          
        return false;
    });

  function modalOpen(dialog) {
    var h = $j(window).height()-80+'px';
    dialog.animate({height: h, width: "820px"}, 0);
  }
});

Perhaps a good workaround would be to at ‘draw-time’ change of height with an animate?

Perhaps I’ve forgotten to do something with the iFrame. Perhaps there is a beer in the fridge that hasn’t got my name on it.

Perhaps and most importantly there is some benevolent techie called Eric that can help me with my quandary.

Cheers

Timi


Create an onShow callback and then try the following:

onShow: function (d) {
    $.modal.setContainerDimensions();
    // or
    //$.modal.update();
}
0

精彩评论

暂无评论...
验证码 换一张
取 消