Thomas89 / simplemodal

Automatically exported from code.google.com/p/simplemodal
0 stars 0 forks source link

Ability to control whether the wrap-div uses overflow: auto. #42

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
I have a bit of a problem when trying to show a div that already uses 
"overflow-x: scroll" to provide scrollbars for a horizontal timeline div that 
is wrapped inside it. My wrapping div is set to use 100%, while the timeline 
div may be more than that (for instance 2500px):

<div id="TimelineDiv" style="overflow-x: scroll">
  <div id="TimelineDiv" style="width: 2500px;">The timeline</div>
</div>

The problem is that in the setContainerDimensions-function (row 493 in v1.3.4), 
SimpleModal adds a "overflow: auto" on its own wrapping div if the data-element 
is wider than the container, which causes double horizontal scroll bars to 
appear. jQuery is reporting that data-element is 2500px wide, while Firebug 
says that it's not wider than the screen. It looks perfectly fine if you 
comment out the row that adds "overflow: auto" to the wrap-div.

Would it be possible to add something that would allow me to disable this 
mechanism, so that it doesn't add "overflow: auto"? For now I can just remove 
the offending line myself, but I'd like it to be upgrade-proof so that I don't 
have to remember and modify SimpleModal every time it's time for an upgrade.

Thanks,
Tomas

Original issue reported on code.google.com by tomas.ka...@gtempaccount.com on 23 Aug 2010 at 11:21

GoogleCodeExporter commented 8 years ago
I added some logic around the overflow:auto code in 1.4 - can you test it and 
see if it resolves your issue. If not, I'll look into a fix.

Original comment by emartin24 on 23 Aug 2010 at 3:35

GoogleCodeExporter commented 8 years ago
It's the same problem, the "simplemodal-wrap" div has "overflow: auto" set, 
which causes the scrollbars.

Another thing that I have hacked into SimpleModal is the option to open a modal 
as position: absolute instead of fixed, to enable scrolling the entire page 
with the modal in it (for large-height modals without overflow-scrollbars).

If you can provide some kind of fix that would be great, otherwise I can live 
with my two edits. Thanks for a great plugin.

Original comment by tomas.ka...@gtempaccount.com on 25 Aug 2010 at 1:19

GoogleCodeExporter commented 8 years ago
I think I am running into a similar or related issue with the scroll bars 
however I started getting the overflow:auto on the wrap div when I switched 
over to the HTML 5 doctype from XHTML transitional. 

I compared every single element and it's css/dimensions. Everything was exactly 
the same except the simplemodal-data had a width that was slightly smaller (925 
vs 940) and a height that was slightly larger (503 vs 500). This div should be 
940x500. The child element is an iframe which is the correct 940x500 size.

Any idea why the html 5 doctype would cause this data div to change height and 
width? I'd love to say it's my css with nothing seeming to be out of the 
ordinary, I am completely stumped.

I am in FF4 as well. 

Thanks,
Dustin

Original comment by dhl...@gmail.com on 7 Jun 2011 at 7:42

GoogleCodeExporter commented 8 years ago
I think you can also add:

onShow: function(dialog){ dialog.wrap.css('overflow','hidden'); }

to the modal options.

Original comment by allan.ro...@enthink.com on 7 Jan 2013 at 5:46