我正在使用Jquery mobile进行数据转换=" slide"。 这样工作正常,每个页面加载是自己的页面,而不是标签数据滑块(如果这有任何区别)
我尝试在滑块转换加载页面后尝试一些JavaScript触发器。 我有一个js文件,用于设置控件的最大高度 - 如果我在页面上刷新并且刷新但是如果它由滑动转换加载,那么JavaScript就不会触发。我已经在pageinit,pageload等中尝试了它,但没有触发。
任何人都可以在这里指出这个问题。 App.JS
$(document).ready(function () {
var header = document.getElementById('header').offsetHeight;
var footer = document.getElementById('pagefooter').offsetHeight;
var wrapperH = window.innerHeight - header - footer - 50;
document.getElementById('maincontent').style.height = wrapperH + 'px';
});
$(document).on("pageinit", function (event) {
var header = document.getElementById('header').offsetHeight;
var footer = document.getElementById('pagefooter').offsetHeight;
var wrapperH = window.innerHeight - header - footer - 50;
document.getElementById('maincontent').style.height = wrapperH + 'px';
});
$(document).off('pageshow');
$(document).on('pageshow', function (e, ui) {
// generally written in pagechange event.
var header = document.getElementById('header').offsetHeight;
var footer = document.getElementById('pagefooter').offsetHeight;
var wrapperH = window.innerHeight - header - footer - 50;
document.getElementById('maincontent').style.height = wrapperH + 'px';
});
基础mvc布局页面
@{
ViewData["Logo"] = "bird.png";
ViewData["Icon"] = "cascade.ico";
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta name="Robots" content="noindex" />
<title>@ViewBag.SiteTitle</title>
<link rel="icon" type="image/x-icon" href="~/img/@ViewBag.Icon" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<environment names="Development">
<!-- Dev uses full file versions for de-bugging -->
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/lib/jquery-mobile-min/jquery.mobile.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
</environment>
<environment names="Staging,Production">
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/jquery-mobile-min/jquery.mobile.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.min.js"></script>
</environment>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link href="~/styles/all/all.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="~/Styles/Mobile/mobile.css" media="only screen and (max-width: 481px)" />
<link rel="stylesheet" type="text/css" href="~/Styles/Desktop/desktop.css" media="only screen and (min-width: 481px)" />
<script type="text/javascript">
</script>
@RenderSection("Scripts", false)
</head>
<body>
<div data-role="page">
<div id = "header" data-role="header" data-id="persistent" data-position="fixed">
<div id="headnav" class="navbar navbar-inverse">
<div class="container">
<div class="navbar-toggle navbar-text" data-toggle="collapse">
<h3 class="title">@ViewBag.Title</h3>
<h5 class="subtitle">@ViewBag.SubTitle</h5>
</div>
<div class="navbar-left" rel="home" href="#" title="@ViewBag.SiteTitle">
<a href="@Url.Action("Index", "App")" title="Home">
<img style="max-width:100px; max-height: 100px; margin-top: 5px"
src="~/img/@ViewBag.Logo">
</a>
</div>
<div class="navbar-collapse collapse navbar-text">
<h3 class="title">@ViewBag.Title</h3>
<h5 class="subtitle">@ViewBag.SubTitle</h5>
</div>
<!-- Logout Box -->
<div class="pull-right">
@await Component.InvokeAsync("Logout")
</div>
</div>
</div>
</div>
<!-- content -->
<div id="maincontent" data-role="content">
@RenderBody()
</div>
<footer id="pagefooter" data-id="persistent" data-position="fixed">
<div class="navbar navbar-inverse navbar-fixed-bottom">
<div class="container-fluid">
<div class="navbar-collapse collapse" id="footer-body">
<ul class="nav navbar-nav">
<li><a data-transition="slide" href="@Url.Action("MyDetails", "App")"><img src="~/img/icons/myrecord.png" />My Record</a></li>
<li><a data-transition="slide" href="@Url.Action("MyTeam", "App")"><img src="~/img/icons/myteam.png" />Team Headcount</a></li>
<li><a data-transition="slide" href="@Url.Action("Holidays", "App")"><img src="~/img/icons/holidays.png" />My Holidays</a></li>
<li><a data-transition="slide" href="@Url.Action("Payslips", "App")"> <img src="~/img/icons/payslips.png" />Payslip</a></li>
<li><a data-transition="slide" href="@Url.Action("Tasks", "App")"><img src="~/img/icons/tasks.png" />Tasks</a></li>
<li><a data-transition="slide" href="@Url.Action("Requests", "App")"><img src="~/img/icons/authorise.png" />Requests</a></li>
</ul>
</div>
@*<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#footer-body">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<ul class="footer-bar-btns visible-xs">
<li><a href="#" class="btn" title="History"><i class="fa fa-2x fa-clock-o blue-text">Link 1</i></a></li>
<li><a href="#" class="btn" title="Favourites"><i class="fa fa-2x fa-star yellow-text">Link 2</i></a></li>
<li><a href="#" class="btn" title="Subscriptions"><i class="fa fa-2x fa-rss-square orange-text">Link 3</i></a></li>
</ul>
</div>*@
</div>
</div>
</footer>
</div>
<!-- overriding customer styles -->
<link href="~/styles/customstyles.css" rel="stylesheet" />
<script src="~/app.js"></script>
</body>
</html>
答案 0 :(得分:0)
最终管理用CSS对此进行排序。
知道顶部和底部菜单栏的高度意味着我可以设置如下:
Sub AddRow()
Dim c, d As Range
Set rng = ActiveSheet.Range("A1:A100")
Set rng2 = Worksheets("Sheet2").Range("A1:A100")
For dblCounter = rng.Cells.Count To 1 Step -1
Set c = rng(dblCounter)
If c.Value Like "XXXXXX" Then
c.EntireRow.Insert
For dblCounter2 = rng2.Cells.Count To 1 Step -1
Set d = rng2(dblCounter2)
If d.Value Like "YYYYYY" Then
d.EntireRow.Insert
End If
Next dblCounter2
End If
Next dblCounter
End Sub
现在没有重叠,我可以在浏览器中自由调试我的网站,它在任何设置上看起来都是正确的。