durgaprassad7 / simplemodal

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

wrong positioning / resizing #41

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago
SimpleModal or SimpleModal Contact Form (SMCF)?
latest SimpleModal 

Version of jQuery?
latest

Browser/OS you are experiencing the problem with?
every

Basicaly the problem is that I've got dynamic content inside simple modal, so I 
can't really set width, height in css and the plugin itself is somehow not able 
to count the sizes properly(only when there are images included it seems though)

http://img835.imageshack.us/img835/8110/68700041.png

Now after click on the image there, the content inside changes, so it needs 
both resize and reposition. So I've tried calling either or both 
$.modal.setContainerDimensions(); and $.modal.update(); the outcome is the same

http://img836.imageshack.us/img836/3123/41845047.png

Now what I've tried was to give #simplemodal-container width: auto !important; 
height: auto !important; it kinda worked, but it was not position correctly 

http://img844.imageshack.us/img844/9125/83492791.png

after click on image there it was even worse(although only on first load, when 
I close it and open again, the modal after clicking on image is position 
correctly)

http://img825.imageshack.us/img825/9532/85645097.png

So, what I've done was leaving that auto height and width there and adding 
$.modal.setContainerDimensions(); to the end of open function, which somehow 
solved the problem, but I don' really think it's the proper and smooth solution.

Original issue reported on code.google.com by fox...@gmail.com on 23 Aug 2010 at 8:19

GoogleCodeExporter commented 8 years ago
Ok, nevermind, what I said that solved it didn't really solve anything..

Original comment by fox...@gmail.com on 24 Aug 2010 at 1:39

GoogleCodeExporter commented 8 years ago
Can you try the latest version (1.4.1) and let me know if you are still having 
issue...

http://code.google.com/p/simplemodal/downloads/list

Original comment by emartin24 on 5 Nov 2010 at 10:45

GoogleCodeExporter commented 8 years ago
I have the same problem with 1.4.1. 

I used simplemodal for something like simple image gallery consists of large 
image and clickable thumbnails changing the large picture.
1st wrong resizing - on modal.open (inner content includes floating divs)
2nd - on resizing of modal block (changing the picture)

Original comment by npavliuc...@terricone.com on 2 Dec 2011 at 8:36

GoogleCodeExporter commented 8 years ago
I have the same problem with 1.4.2, but I've made some workaround.

The centering algorithm doesn't know the correct size of the image, so it fails.
If you pre-load the image before create the modal box using the load event from 
the image, it will center correctly.

var IMAGE = ""; // the image url
$("<img src='" + IMAGE + "'>").load(function(){
    $('#dialog').empty().append($(this)).modal();
});

Original comment by NightArc...@gmail.com on 23 Dec 2011 at 2:07

GoogleCodeExporter commented 8 years ago
I also found that the use of the load event callback is a perfect solution for 
this issue.  I use this approach to load a full-size image from a thumbnail.  
I'd go so far as to say this would be a preferred approach to "fixing" the 
problem in SimpleModal itself.

Original comment by stf.epsi...@gmail.com on 17 Jun 2015 at 6:56