Div标记asp.net中不同窗口大小的高度问题 [英] Div tags height problem in different window sizes in asp.net
本文介绍了Div标记asp.net中不同窗口大小的高度问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
在我的应用程序中我使用3个滑动div。
我的系统分辨率是1280 * 1024
如果我打开这个更高分辨率系统（1336 * 768）它不适合。
我没有得到我需要修改这个东西的地方。
我的要求是，当我点击第一张幻灯片时它应该打开，剩下的2张幻灯片应该下来并将它放在页脚潜水之前的任何窗口分辨率中。
请在这里查看我的代码。
In my Application I am using 3 sliding divs.
My system resolution is 1280*1024
If I open this any higher resolution systems(1336*768) its not fitting.
I am not getting where I need to modify this thing.
My requirement is like, when i click first slide div it should open and remaining 2 slide divs should go down and place it just before the footer dive in any window resolution.
Please check my code here.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<link href="CSS/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="CSS/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<script src="Scripts/jquery.min.js" type="text/javascript"></script>
<script src="Scripts/bootstrap.js" type="text/javascript"></script>
<script type="text/javascript">
</script>
<script type="text/javascript">
$("document").ready(function () {
if ($("#HiddenField1").val() == "block") {
$("#FiltersliderDiv").css("display", "none");
}
if ($("#HiddenField1").val() == "none") {
$("#FiltersliderDiv").css("display", "block");
}
$("#Filters").click(function () {
$("#ReportsliderDiv").slideUp("slow");
$("#FiltersliderDiv").slideToggle("slow");
$("#MapAndChartsliderDiv").slideUp("slow");
});
});
$("document").ready(function () {
if ($("#HiddenField2").val() == "block") {
$("#MapAndChartsliderDiv").css("display", "none");
}
if ($("#HiddenField2").val() == "none") {
$("#MapAndChartsliderDiv").css("display", "block");
}
$("#MapAndChart").click(function () {
$("#FiltersliderDiv").slideUp("slow");
$("#ReportsliderDiv").slideUp("slow");
$("#MapAndChartsliderDiv").slideToggle("slow");
});
});
$("document").ready(function () {
if ($("#HiddenField3").val() == "block") {
$("#ReportsliderDiv").css("display", "none");
}
if ($("#HiddenField3").val() == "none") {
$("#ReportsliderDiv").css("display", "block");
}
$("#Report").click(function () {
$("#FiltersliderDiv").slideUp("slow");
$("#MapAndChartsliderDiv").slideUp("slow");
$("#ReportsliderDiv").slideToggle("slow");
});
});
</script>
<style type="text/css">
#Filters
{
margin: 0;
padding: 0;
left: 0;
color: #FFFFFF;
width: 100%;
height: 22px;
margin-top: 97px;
background-color: #0082AA;
text-align: center;
cursor: pointer;
font-family: Arial;
font-size: 10pt;
font-weight: bold;
line-height: 22px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #FFFFFF;
}
#MapAndChart
{
background-color: #0082AA;
color: #FFFFFF;
width: 100%;
height: 22px;
cursor: pointer;
text-align: center;
font-family: Arial;
font-size: 10pt;
font-weight: bold;
line-height: 22px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #FFFFFF;
}
#Report
{
background-color: #0082AA;
line-height: 22px;
color: #FFFFFF;
width: 100%;
height:22px;
cursor: pointer;
text-align: center;
font-family: Arial;
font-size: 10pt;
font-weight: bold;
}
#FiltersliderDiv
{
width: 100%;
height: 80%;
overflow-x: scroll; /* Hide horizontal scroll bar*/
overflow-y: scroll; /*Show vertical scroll bar*/
}
#MapAndChartsliderDiv
{
margin-top: 10px;
width: 100%;
height: 70%;
}
#ReportsliderDiv
{
width: 100%;
height: 70%;
}
.stripe
{
width: 100%;
margin: 0;
padding: 0;
position: fixed;
top: 0;
left: 0;
height: 95px;
background-image: url('img/MainHeader.png');
background-color: #0082AA;
text-align: right;
background-repeat: no-repeat;
}
.FooterStripe
{
width: 100%;
margin: 0;
padding: 0;
position: fixed;
bottom: 0;
left: 0;
}
#linksignout
{
margin-right: 20px;
text-decoration:none;
}
#bg {position:fixed; top:0; left:0; width:100%; height:100%;}
html {height:100%;}
body {height:100%; margin:0; padding:0;}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="bg">
<div class="stripe">
<asp:LinkButton ID="linksignout" runat="server" Text="Signout"
ForeColor="White" Font-Bold="False"></asp:LinkButton></div>
<div id="Filters">
Filters</div>
<div id="FiltersliderDiv">
<asp:Button ID="Button1" runat="server" Text="Button" /><br />
<asp:Button ID="Button2" runat="server" Text="Button" /><br />
<asp:Button ID="Button3" runat="server" Text="Button" /><br />
<asp:Button ID="Button4" runat="server" Text="Button" /><br />
<asp:Button ID="Button5" runat="server" Text="Button" /><br />
<asp:Button ID="Button6" runat="server" Text="Button" /><br />
<asp:Button ID="Button8" runat="server" Text="Button" /><br />
<asp:Button ID="Button9" runat="server" Text="Button" /><br />
<asp:Button ID="Button10" runat="server" Text="Button" /><br />
<asp:Button ID="Button11" runat="server" Text="Button" /><br />
<asp:Button ID="Button12" runat="server" Text="Button" /><br />
<asp:Button ID="Button13" runat="server" Text="Button" /><br />
<asp:Button ID="Button14" runat="server" Text="Button" /><br />
<asp:Button ID="Button15" runat="server" Text="Button" /><br />
<asp:Button ID="Button7" runat="server" Text="Button" /><br />
<asp:Button ID="Button16" runat="server" Text="Button" /><br />
<asp:Button ID="Button17" runat="server" Text="Button" /><br />
<asp:Button ID="Button18" runat="server" Text="Button" /><br />
</div>
<div id="MapAndChart">
Map and Chart</div>
<div id="MapAndChartsliderDiv">
</div>
<div id="Report">
Report</div>
<div id="ReportsliderDiv">
</div>
<asp:HiddenField ID="HiddenField1" runat="server" Value="block"/>
<asp:HiddenField ID="HiddenField2" runat="server" Value="block"/>
<asp:HiddenField ID="HiddenField3" runat="server" Value="block"/>
<asp:HiddenField ID="HiddenField4" runat="server" Value="block"/>
<div class="FooterStripe"> <img src="img/MainFooter.png" style="width: 100%;" /></div>
</div>
</form>
</body>
</html>推荐答案
(\"document\").ready(function () {
if (
("document").ready(function () { if (
(\"#HiddenField1\").val() == \"block\") {
("#HiddenField1").val() == "block") {
(\"#FiltersliderDiv\").css(\"display\", \"none\");
}
if (
("#FiltersliderDiv").css("display", "none"); } if (
这篇关于Div标记asp.net中不同窗口大小的高度问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
