[OpenLayers-Dev] mobile-jq example does not work with current jQuery Mobile (was: Current and Future jQuery mobile will not work with OpenLayers.)

[Volker Mische]

Hi all,

reviving an old thread. I just ran into the issue. The problem is that 
OpenLayers doesn't calculate the size of hidden elements (display:none) 
correctly, but jQuery mobile hides the element that contains 
data-role"page". The solution for this problem is to set the element and 
all its parents (if they are hidden as well) to 
display:block;position:absolute;visibility:hidden.

You can read more about the problem and its solution here [1] and in the 
jQuery source code [2] (search for showCss).

[1] 
http://www.foliotek.com/devblog/getting-the-width-of-a-hidden-element-with-jquery-using-width/
[2] 
https://github.com/jquery/jquery/blob/124817e6684086ccf74e509309b73d4b4dd89932/src/css.js

A workaround for jQuery Mobile 1.0b1 is to add to the element that 
contains data-role="page" a css class named "ui-page-active"

Should we incorporate a way to calculate the size of hidden elements 
into OpenLayers?

Cheers,
   Volker

On 07/12/2011 02:11 AM, Andreas Hocevar wrote:
> Hi Noli,
>
> the subject of this thread adds a lot of drama to to the content that
> is not actually there. So I changed the subject. Anybody is welcHiome to
> fix the mobile-jq example. A non-working example does not mean that
> OpenLayers is broken.
>
> Regards,
> Andreas.
>
> On Tue, Jul 12, 2011 at 10:43 AM, Noli Sicad<nsicad at gmail.com>  wrote:
>> Hi Andreas,
>>
>> I just tested the official jQuery Mobile example in OL 2.11 RC1.
>>
>> It is not working with the beta1 jQM release.
>>
>> You can download.
>>
>> 1.I am using mobile-jq.html in OpenLayers-2.11-rc1.tar.gz
>> http://www.openlayers.org/download/
>>
>> 2. jQuery Mobile --- Zip File: jquery-mobile-1.0b1.zip (JavaScript,
>> CSS, and images)
>> http://jquerymobile.com/download/
>>
>> 3. jQuery 1.6.2
>> http://docs.jquery.com/Downloading_jQuery
>>
>> The jquery mobile 1.0b1pre is working after this version. It is not working.
>>
>> Noli
>>
>>
>> On 7/12/11, Andreas Hocevar<ahocevar at opengeo.org>  wrote:
>>> Can we have a link to an example that shows the issue, which uses
>>> unminified versions of both OpenLayers and jQuery? This will make it
>>> easier to locate the issue.
>>>
>>> Thanks,
>>> Andreas.
>>>
>>> On Mon, Jul 11, 2011 at 5:43 AM, Noli Sicad<nsicad at gmail.com>  wrote:
>>>> Hi,
>>>>
>>>> I like to inform everybody that the current and future releases of
>>>> jQuery Mobile will not work with OL until this issue is resolved.
>>>>
>>>> https://github.com/jquery/jquery-mobile/issues/search?q=OpenLayers
>>>>
>>>> If you know what is causing the problem, please let us.
>>>>
>>>> Noli
>>>> _______________________________________________
>>>> Dev mailing list
>>>> Dev at lists.osgeo.org
>>>> http://lists.osgeo.org/mailman/listinfo/openlayers-dev
>>>>
>>>
>>>
>>>
>>> --
>>> Andreas Hocevar
>>> OpenGeo - http://opengeo.org/
>>> Expert service straight from the developers.
>>>
>> _______________________________________________
>> Dev mailing list
>> Dev at lists.osgeo.org
>> http://lists.osgeo.org/mailman/listinfo/openlayers-dev
>>
>
>
>