当#rightdiv被隐藏时,如何将#leftdiv的宽度设置为100%,当单击该按钮时,两个div应该彼此相邻.
按钮点击时我已经将两个div相邻,但是当#rightdiv被隐藏时我想将#leftdiv扩展到100%.
function toggleSideBar() {
var div = document.getElementById('rightdiv');
if (div.style.display !== 'none') {
div.style.display = 'none';
}
else {
div.style.display = 'block';
}
};#leftdiv
{
border: solid medium thick;
float: left;
display: inline-block;
background-color: #ffc;
/*border: 1px solid red;*/
}
#rightdiv
{
width: 50%;
border: solid medium thick;
background-color: #ffa;
display: none;
float:right;
}<input type="button" id="btn" value="toggle" onclick="toggleSideBar()" />
<div id="main-content">
<div id="leftdiv">selectable</div>
<div id="rightdiv">right panel</div>
</div>`这可能是一个愚蠢的问题,但这确实令人头疼.
我无法使内容可滚动,我没有添加任何内容,我无法无缘无故滚动.
我刚开始一个新的页面,我正在动态填充列表,但我面临的问题是我无法滚动
这是我的完整代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</head>
<body ng-app="starter">
<ion-content>
<div ng-controller="customersCtrl">
<div class="list">
<div ng-repeat="m …我正在玩弄HTML和Javascript中的一些基本结构(即,我是一个HTML/Javascript n00b),并且有一个功能我似乎无法正确实现.简而言之,我想从HTML页面的主体中获取文本并使用Javascript(eval()或new Function())对其进行评估.要看到我对eval()的使用是正确的,我首先尝试了以下代码,它按预期工作(并显示值5):
<script>
window.onload = function () {
eval("var t = function () { if (5>0) return 5; }();");
document.body.innerHTML = t;
}
</script>
但是,当我尝试实现从HTML中获取"代码"并运行它的目标时,这对我来说似乎失败了.这是一段不起作用的代码(我尝试过很多变种):
<script>
window.onload = function() {
var x = document.getElementById("myP").innerHTML;
eval("var e = " + x + ";");
document.body.innerHTML = e();
}
</script>
<body>
<p id="myP">function () { if (5>1) { return 5; } } </p>
</body>
我测试了变量x确实包含了正文中所需的"代码".但由于某种原因,上述情况将无法正常运作; 它只会显示正文并eval在更新innerHTML后忽略它和语句.
更奇怪的是,当我尝试"更复杂"的代码时,它工作正常,例如:
<script>
window.onload = function() {
var x = document.getElementById("myP").innerHTML;
eval("var e …