I have the following problem using jquery mobile 1.4.5:
I have a dropdown menu that doesn't position where I want in my window page. It is always shown in the top left corner.
<head><!--jquery initiation-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css">
</head>
I used the following codes but nothing help.
option 1 classic :
<select data-mini="true" data-inline="true" id="locality-dropdown" name="locality" multiple="multiple" style="background-color:red;position: absolute; top:230px; left:20px;" data-native-menu="false">
</select>
whereas the button widget with the same syntax works!
(
<button data-mini="true" data-inline="true" id="Gm" style="background-color:yellow; position: absolute; top:280px; left:10px" onclick="Test()">
</button>
)
option 2
<style>
.theClass {
position: fixed; /* or absolute */
top: 200px;
left: 200px;
}
.thediv {
position: absolute;
top: 200px;
left: 200px;
}
.ui-content {
padding: 0;
}
</style>
<div role="main" class="ui-content">
<div class="thediv"></div>
<select data-mini="true" data-inline="true" id="locality-dropdown" class="theClass" name="locality" multiple="multiple" data-native-menu="false">
</select>
</div>
none of them work :( - any good idea?
question from:
https://stackoverflow.com/questions/65865054/how-to-position-widget-in-jquery-mobile-environment 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…