I am building a PhoneGap/Cordova app and have a simple code that uses http://ricostacruz.com/jquery.transit/ to display a div when another div is clicked.

<style>
#hiddendiv {
    top: -2000px;
    position:absolute;
}
</style>

<script>
$('#clickme').click(
            function() {
            //SHOW DIV
            $('#hiddendiv').transition({ y: '2100px' });
            });
</script>

<!--HTML-->
<div id="hiddendiv">
Lorem Ipsum blah blah blah Loooong piece of text
</div>

<div id="clickme">
Click Me
</div>

And it works fine. The issue is that I cannot scroll on my device once the #hiddendiv is displayed.

I this is partly because the page is only about 500px height (not actually set anywhere) whilst the #hiddendiv is about 1500px height

Does anyone know of a work around for this?