最小化浏览器后无法在输入框中输入
[英]Can't Type in input box after minimizing browser
问题描述
I am using Vistual Studio 2012 with Bootstrap 3 (cosmo-bootstrap themes) to style my page. 
我正在将Vistual Studio 2012与Bootstrap 3（cosmo-bootstrap主题）配合使用来设置页面样式。 The page works fine when the browser is maximized; 当浏览器最大化时，页面工作正常； however, I can't type in my input text box if the page is restored down to certain size. 但是，如果页面已还原到特定大小，则无法在输入文本框中输入内容。 Has anyone else has this issue? 还有其他人有这个问题吗？ What can I do to solve this issue? 我该怎么做才能解决这个问题？ Below is one of my layout page. 以下是我的布局页面之一。
<!DOCTYPE html>
<html>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<head>
<title>@ViewBag.Title</title>
<link href="../../Content/css/bootstrap.min.css" rel="stylesheet" />
<link href="../../Content/cosmo-boostrap.min.css" rel="stylesheet" />
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
</head>
<body>
@* <fb:login-button scope="public_profile,email" onlogin="checkLoginState();">
</fb:login-button>*@
<div id="status">
</div>
</div>
<div id="page">
<header class="container">
<div id="menu" class="navbar navbar-default navbar-fixed-top">
<div class="navbar-header">
<button class="btn btn-success navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="glyphicon glyphicon-chevron-down"></span>
</button>
<div id="logo" id="logo" class="col-md-6 col-md-offset-6 col-sm-7 col-sm-offset-5 col-xs-8 col-xs-offset-4">
<img src="../../Images/logo.png" alt="THE BOOK UP" class="image-responsive" /> @Html.ActionLink(SessionWrapper.Student.FirstName +" "+ SessionWrapper.Student.LastName ,"UserProfile","Student", null, new {id = SessionWrapper.Student.UserId})
</div>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li id="ListBook" class= "nav">
@* @Html.ActionLink("List Books", "ListBook", "Student")*@
<label class="btn btn-primary" onclick="location.href='@Url.Action("ListBook", "Student")'">List Books</label>
</li>
<li id="FindBook" class="nav">
@* @Html.ActionLink("Find Books", "FindBook", "Student")*@
<label class="btn btn-primary" onclick="location.href='@Url.Action("FindBook", "Student")'">Find Books</label>
</li>
<li id= "index" class="nav">
@* @Html.ActionLink("Add Books", "AddBook", "Student")*@
<label class="btn btn-primary" onclick="location.href='@Url.Action("AddBook", "Student")'">Add Book</label>
</li>
<li id="addUser" class="nav">
<label class="btn btn-primary" onclick="location.href='@Url.Action("AddUser","Home")'">Add User</label>
</li>
<li id="Logoff" class="nav">
@* @Html.ActionLink("Log Off", "LogOff", "Account", new { onclick="logOut()" })*@
<label class="btn btn-primary" onclick="logOut(1)">Log out</label>
</li>
</ul>
</div>
</div>
</header>
<section id="body" class="container">
<section id="main" class="col-md-10 col-sm-10 col-xs-12">
@RenderBody()
</section>
<section id="sidebar" class="col-md-2 col-sm-2">
<table style="background-color: black;">
<tr>
<td style="width: 150px; height: 150px;">
<div id="AddCarousel" class="carousel slide" data-ride="carousel" data-interval="3000" data-wrap="true">
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="../../Images/adds/Desert.jpg" id="pic1" alt="Desert" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Desert</h3>
</div>
</div>
<div class="item">
<img src="../../Images/adds/koala.png" id="pic2" alt="Koala" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Koala</h3>
</div>
</div>
<div class="item">
<img src="../../Images/adds/Jellyfish.jpg" id="pic3" alt="Jelly Fish" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Jelly Fish</h3>
</div>
</div>
<div class="item">
<img src="../../Images/adds/Tulips.jpg" id="pic4" alt="Tulips" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Tulips</h3>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr>
<td style="width: 150px; height: 150px;">
<div id="AddCarousel" class="carousel slide" data-ride="carousel" data-interval="3000" data-wrap="true">
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="../../Images/adds/Desert.jpg" id="pic1" alt="Desert" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Desert</h3>
</div>
</div>
<div class="item">
<img src="../../Images/adds/koala.png" id="pic2" alt="Koala" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Koala</h3>
</div>
</div>
<div class="item">
<img src="../../Images/adds/Jellyfish.jpg" id="pic3" alt="Jelly Fish" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Jelly Fish</h3>
</div>
</div>
<div class="item">
<img src="../../Images/adds/Tulips.jpg" id="pic4" alt="Tulips" class="thumbnail image-responsive">
<div class="carousel-caption">
<h3>Tulips</h3>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
</section>
</section>
<hr />
<footer class="container">
<p>© of K&M Systems Solution <a href="www.k&m.com">K&M</a>. </p>
</footer>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
@* <script data-main="scripts/js/mbtest" src="~/Scripts/js/require.js"></script>*@
<script src="../../Scripts/js/bootstrap.min.js"></script>
<script src="../../Scripts/js/site.js"></script>
</body>
</html>
<script>
$('#pic1').attr("src", '../../Images/adds/koala.png');
//$('.carousel').carousel({
// interval: 3000
//});
@* window.fbAsyncInit = function () {
FB.init({
appId: '296813847191603',
xfbml: true,
version: 'v2.1'
});
FB.getLoginStatus(function (response) {
statusChangeCallback(response);
});
};
(function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) { return; }
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));*@
function logOut(e) {
@* window.fbAsyncInit = function () {
alert('init');
FB.init({
appId: '296813847191603',
xfbml: true,
version: 'v2.1'
});
};
if (typeof FB.logout == 'function') {
if (FB.getAuthResponse()) {
FB.logout(function (response) { location.href = '@Url.Action("LogOff", "Account")'; });
return;
}
} else {
location.href = '@Url.Action("LogOff", "Account")';
return;
}*@
if (e == 1) {
location.href = '@Url.Action("LogOff", "Account")';
}
}
</script>
1 个解决方案
解决方案1
1 已采纳 2014-11-03 18:19:22
The issue was my Sidebar was taking over the main form. 问题是我的补充工具栏正在接管主要表单。 In my css file, I added the lines shown below; 在我的css文件中，添加了如下所示的行； the issue was fixed. 该问题已解决。
#sidebar
{
overflow: hidden;
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
为什么输入标签不能输入类型？ - Why can't a input tag be type submit?
最小化浏览器时div重叠 - The divs overlapping when minimizing the browser
尝试在浏览器中安装支架后未映射类型 - The type was not mapped after trying to scaffolded controller in browser
提交后清除 POST 数据，以便用户无法在浏览器中单击返回 - Clear POST data after submission so user can't click Back in browser
如何在ajax组合框中键入文本 - how can type text in the ajax combo box
如何使用jquery比较两个文本输入类型框值 - how to compare two text input type box values using jquery
如果输入类型文本框不为空，Webmatrix如何添加类？ - Webmatrix how to add a class if input type text box is not empty?
为什么是 <input type=“file”> IE8中显示灰色框？ - Why is <input type=“file”> box grey in IE8?
如何在asp.net中设置文本框输入type =“ text”？ - How to set a text Box Input type=“text” in asp.net?
处理特定于浏览器的HTML输入type =“ date”支持 - Handling browser-specific support of HTML input type=“date”
相关标签