views:

732

answers:

2

I'm using SimpleModal:

http://www.ericmmartin.com/projects/simplemodal/

And displaying an iframe, as per the example:

// Display an external page using an iframe
var src = "http://365.ericmmartin.com/";
$.modal('<iframe src="' + src + '" height="450" width="830" style="border:0">', {
    closeHTML:"",
    containerCss:{
        backgroundColor:"#fff",
        borderColor:"#fff",
        height:450,
        padding:0,
        width:830
    },
    overlayClose:true
});

And the popup has two sets of scrollbars, one perhaps for the HTML element representing the popup, and one for the iFrame. Try the demo to see: http://www.ericmmartin.com/projects/simplemodal/#examples

Ideally I'd like no scrollbars if the content fits, otherwise a single vertical scrollbar.

Any ideas? Thanks!

  • Alex
+1  A: 

This only work for the sample code content i.e "eric.martin.com", not sure if you can control the width for other external content, most probably can't :)

 containerCss:{
    backgroundColor:"#fff",
    borderColor:"#fff",
    height:450,
    padding:0,
    width:830,
    maxWidth : 800
},
Puaka
The iframe will be displaying my own content, so I can control it.
Alex Black
then just make sure the width a few px wider than its content so you only get the vertical bar
Puaka
Thanks, got that to work. I didn't need maxWidth, just needed to set width and height in containerCss to be slightly larger than the iFrame set width and height.
Alex Black
You are welcome :)
Puaka