0
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="mysite/css/jquery-ui.css">
<script src="mysite/js/jquery-1.12.4.js"></script>
<script src="mysite/js/jquery-ui.js"></script></head><body><nav class="navbar navbar-default" data-spy="affix" data-offset-top="197" role = "navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type = "button" class = "navbar-toggle"
data-toggle = "collapse" data-target = "#example-navbar-collapse">
<span class = "sr-only">Toggle navigation</span>
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
<span class = "icon-bar"></span>
</button>
<a class="navbar-brand" href="mysite/Dashboard.php"><img src='mysite/img/logo43.png'></a>
</div>
<div class = "collapse navbar-collapse" id = "example-navbar-collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Stock
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="mysite/update.php">Change Stock</a></li> <li><a href="mysite/search.php">Stock Details</a></li> <li><a href="mysite/totalstock.php">Total Stock</a></li> <li><a href="mysite/report.php">Item Movement</a></li> </ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Add
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="mysite/add/addItem.php">Add Item</a></li> <li><a href="mysite/add/addBrands.php">Add Brand</a></li> <li><a href="mysite/add/addCategory.php">Add Category</a></li> <li><a href="mysite/add/addUser.php">Add User</a></li> </ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">All Operations
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="mysite/view/viewStock.php">All Items</a></li> <li><a href="mysite/view/viewBrand.php">All Brands</a></li> <li><a href="mysite/view/viewCategory.php">All Categories</a></li> <li><a href="mysite/view/viewUser.php">All Users</a></li> </ul>
</li>
<li><a href="mysite/dailyreport.php">Daily Report</a></li> </ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#"><span class="glyphicon glyphicon-user"></span> Welcome burhantec</a></li>
<li><a href="mysite/logout.php"><span class="glyphicon glyphicon-log-in"></span> Logout</a></li>
</ul>
</div>
</div>
</nav><div class='alert alert-success'><strong>Hello ! </strong>Welcome to Mysite Technology Computer Company, It is a great honour to have you in our team.</div>
<script src="mysite/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="mysite/css/bootstrap.min.css">
<style>
body {
background: rgba(38, 102, 157, 0.87);
color: white;
}
.td-center{
text-align: center;
}
.th-center{
text-align: center;
}
input{
color: black;
}
input.userlogin{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
border: 1px solid rgba(255, 255, 255, 0.4);
background-color: rgba(255, 255, 255, 0.2);
width: 250px;
border-radius: 3px;
padding: 10px 15px;
margin: 0 auto 10px auto;
display: block;
text-align: center;
font-size: 18px;
color: white;
-webkit-transition-duration: 0.25s;
transition-duration: 0.25s;
font-weight: 300;
}
input.userlogin:focus{
left: -10%;
position: relative;
width: 120%;
}
.btnlogin{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
border: 1px solid rgba(255, 255, 255, 0.4);
width: 250px;
border-radius: 3px;
padding: 10px 15px;
margin: 0 auto 10px auto;
display: block;
text-align: center;
font-size: 18px;
color: white;
-webkit-transition-duration: 0.25s;
transition-duration: 0.25s;
font-weight: 300;
background-color: white;
color: rgba(38, 102, 157, 0.87);
}
.btnlogin:hover{
color: white;
background-color: rgba(38, 102, 157, 0.87);
cursor: pointer;
}
.navbar-inverse {
background-color: #002E56;
}
.affix {
top: 0;
width: 100%;
z-index: 99;
}
.affix + .container-fluid {
padding-top: 70px;
}
th.td-center{
background-color: #F5AC56;
}
.export-message{
position: absolute;
top: 120px;
right: 120px;
}
.modal-content {
background-color: #5f7a92;
}
.mg-left{
margin-left:20px;
}
.mg-top{
margin-top: 20px;
}
.mg-bottom{
margin-bottom: 20px;
}
</style>
<script type="text/javascript">
$('ul.nav li.dropdown').hover(function() {
$(this).find('.dropdown-menu').stop(true,true).delay(200).fadeIn(200);
}, function() {
$(this).find('.dropdown-menu').stop(true, true).delay(200).fadeOut(200);
});
</script>
</body></html>
試圖移動視圖時，這不是我的手機&桌面谷歌瀏覽器響應很遺憾，但是當我試圖在桌面上的Mozilla Firefox移動視圖它是工作..引導不工作在移動設備上
我我用引導jQuery UI的這個Web應用程序
你能告訴我們這是行不通的嗎？它是整個網站嗎？網站的響應部分？ 如果它是網站的響應部分，原因是您不使用引導網格系統。 –
響應部分不工作，但我使用的引導程序導航欄自動更改爲'3水平線'圖標，當點擊它時，顯示子菜單，除此之外，我只有一行顯示'welcome to mysite ...'，這也是我用作警報，我不認爲我需要網格系統 –
我無法看到視口的元，導致觸發的響應 – Cheshire