[OpenLayers-Users] jquery draggable item to go on top of my openlayers map

Wed May 23 05:03:27 PDT 2012

Hi,

Did you try to add a higher z-index to your #draggable object ?
#draggable { width: 150px; height: 150px; padding: 0.5em;z-index:10000}

Regards

Jerome
--
http://mapshup.info

2012/5/21 jdmorgan <jdmorgan at unca.edu>:
> Hello,
> I am trying to get a jquery draggable item to go on top of my openlayers
> map.  Unfortunately it always goes behind the map.  Does anyone in this
> community have any experience with this that can point me in the right
> direction? Here is my code:
>
>
> <html xmlns="http://www.w3.org/1999/xhtml">
> <head>
> <title>NEMAC OpenLayers GIS Viewer Dev</title>
> <script src="libs/ol21/lib/OpenLayers.js"></script>
> <script type="text/javascript" src="libs/jquery18/jquery-1.7.2.js"></script>
> <script type="text/javascript" src="test.js"></script>
> <link rel="stylesheet" href="libs/jquery18/themes/base/jquery.ui.all.css">
> <script src="libs/jquery18/ui/jquery.ui.core.js"></script>
> <script src="libs/jquery18/ui/jquery.ui.widget.js"></script>
> <script src="libs/jquery18/ui/jquery.ui.mouse.js"></script>
> <script src="libs/jquery18/ui/jquery.ui.draggable.js"></script>
> <link rel="stylesheet" href="../demos.css">
> </head>
> <style>
>        body {
>            margin: 0;
>            padding: 0;
>        }
>        #banner {
>            background-color: Whitesmoke;
>            margin: 0;
>            padding: 1px 0 0 0;
>        }
>        #mainMenu {
>            width:100%;
>            margin-bottom:.2em;
>        }
>        #content {
>            width:100%;
>        }
>        #draggable { width: 150px; height: 150px; padding: 0.5em;}
> </style>
> <script>
>        $(function() {
>            $( "#draggable" ).draggable();
>        });
> </script>
> <body onload="init();">
> <div id="draggable" class="ui-widget-content">
> <p>Drag me around</p>
> </div>
> <div id="banner">
>        NEMAC OpenLayers Viewer
> <div id="mainMenu" align="center">
>         Theme:<select id="themeCombo"></select>
> </div>
> </div>
> <div id="content">
> <div id="mainMap"></div>
> </div>
> </body>
> </html>
>
>
> --
> Derek @ NEMAC
>
> _______________________________________________
> Users mailing list
> Users at lists.osgeo.org
> http://lists.osgeo.org/mailman/listinfo/openlayers-users