No bleeding out when using a JQM control on a page

No bleeding out when using a JQM control on a page

Hi all,

I have the following scenario:

- a static index.html page that looks like this:

<html>

 <head> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 

 </head>
 <body>

  <script src="myscript.js"/>

 </body>

</html>

- at runtime I create a container <div id="container-uniqueid"></div> as a direct child of the body element

- I dynamically load a jquery mobile control (e.g. slider) at the press of a button and place the jquery mobile control inside the "#container-uniqueid" div

Is there a way to prevent JQM from bleeding out of this container ? It currently adds classes "ui-mobile-viewport ui-overlay-a" to the body and a div data-role="page" with classes " ui-page ui-page-theme-a ui-page-active"?

I would like it to not bleed out of the container and still render the slider control correctly.

Thanks!