- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
我尝试在不使用 JQuery 的情况下编写自适应网页。但是我遇到了两个问题。1.当我放大窗口出现滚动条时,左边的线不能自动重绘。2.内容无法全部显示出来,见截图底部。我在下面的快照中标记了这两个问题。查看详情请到LINK ,谢谢你的帮助。 我想上传快照,但由于信誉不足 10,我失败了。所以请访问我的个人页面查看快照。再次感谢。
我的代码如下:
<!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>
<meta content="width=device-width, initial-scale=1.0, user-scalable=no" name="viewport" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>
</title>
<style type="text/css">
body
{
margin:0px;
padding:0px;
border:0px;
display:block;
z-index:-9999;
width:100%;
height:100%;
left:0px;
top:0px;
overflow:auto;
font-family: Arial,Helvetica,sans-serif;
}
div.bg
{
background-color:#fefefe;
position:absolute;
left:0px;
top:0px;
width:100%;
height:100%;
display:block;
z-index:-8888;
}
</style>
<script language="javascript" type="text/javascript">
var sw = 0, sh = 0;
var b = true;
function alignImg() {
if (b) {
document.getElementById("bot").style.top = (sh-40)+"px";
document.getElementById("rig").style.left = (sw - 40) + "px";
document.getElementById("debug").innerHTML = "sw: " + sw + " sh:" + sh + " f:" + b;
}
if (!b) {
document.getElementById("bot").style.top = "66px";
document.getElementById("rig").style.left = "66px";
document.getElementById("debug").innerHTML = "reed.xia@gmail";
}
b = !b;
}
(function (d) {
setInterval(function () {
w = d.body.clientWidth;
h = d.body.clientHeight || window.innerHeight;
document.title = w + " : " + h;
document.getElementById("bot").style.top = (sh-40)+"px";
document.getElementById("rig").style.left = (sw-40)+"px";
document.getElementById("cn").style.top = 300+"px";
document.getElementById("cn").style.left = (sw - 112) / 2 + "px";
document.getElementById("en").style.top = 500 + "px";
document.getElementById("en").style.left = (sw-178)/2+"px";
document.getElementById("pig").style.left = (sw - 210) / 2 + "px";
document.getElementById("menu").style.left = (sw - 220) / 2 + "px";
document.getElementById("debug").style.left = (sw - 146) / 2 + "px";
if (sw !== w || sh !== h) {
sw = w;
sh = h;
}
}, 1);
})(document)
</script>
</head>
<body id="body" >
<div class="bg" >
<div>
<a href="#" ><img src="images/circle-ydall.png" alt="circle-ydall" style="position:absolute;top:0px;left:0px;width:40px;height:40px;z-index:-3333;background-color:#909090;" /></a>
<a href="#" ><img src="images/circle-wedall.png" alt="circle-wedall" style="position:absolute;top:0px;right:0px;width:40px;height:40px;z-index:-3333;background-color:#909090;" /></a>
<a href="#" ><img src="images/circle-yedall.png" alt="circle-yedall" style="position:fixed;bottom:0px;left:0px;width:40px;height:40px;z-index:-3333;background-color:#909090;" /></a>
<div id="menu" style="position:absolute;top:10px;left:40px;height:40px;z-index:-3333;">
<a href="#" ><img src="images/ydall.png" alt="ydall" style="height:20px;z-index:-3333;background-color:#909090;"/></a>
<a href="#" ><img src="images/wedall.png" alt="ydall" style="height:20px;z-index:-3333;background-color:#909090;"/></a>
<a href="#" ><img src="images/yedall.png" alt="ydall" style="height:20px;z-index:-3333;background-color:#909090;"/></a>
</div>
<div id="pig" style="position:absolute;top:80px;left:100px;height:180px;z-index:-3333;">
<img src="images/bigAllIn1.png" alt="bigAllIn1" style="height:180px;z-index:-3333;background-color:#909090;"/>
</div>
</div>
<div id="cn" style="position:absolute;top:41px;left:41px;z-index:-6666;background-color:#e0e0e0;" >
<h4 style="color:#606060">欢迎来到云道!</h4>
<h4 style="color:#606060">属于您的逼格!</h4>
<a href="http://www.ycpai.com/p_21104">进入</a>
</div>
<img id="row" src="images/row.png" alt="seperate row" style="position:absolute;top:40px;width:100%;height:1px;z-index:-5555;" />
<img id="col" src="images/column.png" alt="seperate column" style="position:absolute;left:40px;width:1px;height:100%;z-index:-5555;" />
<img id="bot" src="images/row.png" alt="seperate row" style="position:fixed;top:215px;width:100%;height:1px;z-index:-5555;" />
<img id="rig" src="images/column.png" alt="seperate column" style="position:fixed;left:215px;width:1px;height:100%;z-index:-5555;" />
<div id="en" style="position:absolute;top:157px;left:17px;z-index:-6666;background-color:#b0b0b0;" >
<h4 style="color:#606060">Welcome to YDall.com!</h4>
<h4 style="color:#606060">Awesome only for you!</h4>
<a href="http://www.ycpai.com/p_21104">Enter</a>
</div>
<div style="position:fixed;bottom:0px;right:0px;height:40px;z-index:-6666;display:block;background-color:#b0b0b0;">
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</div>
<p id="debug" style="position:fixed;bottom:0px;left:60px;z-index:-2222;background-color:#909090;" >reed.xia@gmail.com</p>
</div>
<a href="#" onclick="alignImg()"><img src="images/favicon200x200.png" alt="favicon200x200" style="position:fixed;width:40px;height:40px;bottom:0px;right:0px;z-index:-3333;background-color:#909090;" /></a>
</body>
</html>
最佳答案
Use this replace you body code:
<body id="body" >
<div class="bg" >
<div>
<a href="#" ><img src="images/circle-ydall.png" alt="circle-ydall" style="position:absolute;top:0px;left:0px;width:40px;height:40px;z-index:-3333;background-color:#909090;" /></a>
<a href="#" ><img src="images/circle-wedall.png" alt="circle-wedall" style="position:absolute;top:0px;right:0px;width:40px;height:40px;z-index:-3333;background-color:#909090;" /></a>
<a href="#" ><img src="images/circle-yedall.png" alt="circle-yedall" style="position:fixed;bottom:0px;left:0px;width:40px;height:40px;z-index:-3333;background-color:#909090;" /></a>
<div id="menu" style="position:absolute;top:10px;left:40px;height:40px;z-index:-3333;">
<a href="#" ><img src="images/ydall.png" alt="ydall" style="height:20px;z-index:-3333;background-color:#909090;"/></a>
<a href="#" ><img src="images/wedall.png" alt="ydall" style="height:20px;z-index:-3333;background-color:#909090;"/></a>
<a href="#" ><img src="images/yedall.png" alt="ydall" style="height:20px;z-index:-3333;background-color:#909090;"/></a>
</div>
<div style="position:absolute;left:50px;top:50px;z-index:-3333;"/>
<a href="images/q1.png"> question snapshot</a>
</div>
<div id="pig" style="position:absolute;top:80px;left:100px;height:180px;z-index:-3333;">
<img src="images/bigAllIn1.png" alt="bigAllIn1" style="height:180px;z-index:-3333;background-color:#909090;"/>
</div>
</div>
<div id="cn" style="position:absolute;top:41px;left:41px;z-index:-6666;background-color:#e0e0e0;" >
<h4 style="color:#606060">欢迎来到云道!</h4>
<h4 style="color:#606060">属于您的逼格!</h4>
<a href="http://www.ycpai.com/p_21104">进入</a>
</div>
<img id="row" src="images/row.png" alt="seperate row" style="position:absolute;top:40px;width:100%;height:1px;z-index:-5555;" />
<img id="col" src="images/column.png" alt="seperate column" style="position:absolute;left:40px;width:1px;height:100%;z-index:-5555;" />
<img id="bot" src="images/row.png" alt="seperate row" style="position:fixed;top:215px;width:100%;height:1px;z-index:-5555;" />
<img id="rig" src="images/column.png" alt="seperate column" style="position:fixed;left:215px;width:1px;height:100%;z-index:-5555;" />
<div id="en" style="position:absolute;top:157px;left:17px;z-index:-6666;background-color:#b0b0b0;" >
<h4 style="color:#606060">Welcome to YDall.com!</h4>
<h4 style="color:#606060">Awesome only for you!</h4>
<a href="http://www.ycpai.com/p_21104">Enter</a>
</div>
<div style="position:fixed;bottom:0px;right:0px;height:40px;z-index:-6666;display:block;background-color:#b0b0b0;">
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</div>
<p id="debug" style="position:fixed;bottom:0px;left:60px;z-index:-2222;background-color:#909090;" >reed.xia@gmail.com</p>
</div>
<a href="#" onclick="alignImg()"><img src="images/favicon200x200.png" alt="favicon200x200" style="position:fixed;width:40px;height:40px;bottom:0px;right:0px;z-index:-3333;background-color:#909090;" /></a>
</body>
关于javascript - 滚动条并刷新 JavaScript 中的一行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27653396/
我们知道,当使用 hibernate 对数据库进行批量更新时(即使在 HQL 中),所做的更改不会复制到存储在当前 session 中的实体。 所以我可以调用 session.refresh 来加载对
我正在做一个项目,所有的东西都保存在事件中,所以服务器需要一些时间来响应新数据。我正在使用 Fluent 等待使用 ajax 的页面,但是这个不使用任何 ajax。所以我想刷新页面检查是否有新项目,如
我有一个从 Vector 创建的 JTable。 如何刷新 JTable 以显示添加到 Vector 的新数据? 最佳答案 当 TableModel 发生更改时,您的 JTable 应该会自动更新。我
有没有办法使用下面的代码来刷新已经存在的 div id,而不是刷新时间? window.onload = startInterval; function startInterval() {
我更新了在 Shiny Server 上运行的 Shiny 应用程序使用的 DataSet.RData。但是, Shiny 的应用程序仍在旧数据上运行。我已通过浏览器历史记录清除并重新启动浏览器几次,
我的应用程序中有一个无限滚动的网格面板(ExtJs 4.2.1),类似于 this example .用户可以单击刷新按钮,然后必须使用数据库中的数据更新网格的行。我在刷新按钮处理程序中调用 stor
我不知道这三种方法中哪一种最适合我。他们都为我工作。有谁知道刷新、更新和重画之间的区别吗? 最佳答案 根据在线文档: Refresh - 重新绘制屏幕上的控件。 Call Refresh method
有什么办法吗 ICollectionView.Refresh() 或者 CollectionViewSource.GetDefaultView(args.NewValue).Refresh(); 在
这个问题已经有答案了: Updating address bar with new URL without hash or reloading the page [duplicate] (4 个回答)
我有一个 javascript 设置超时以在 10 秒后关闭 div,并且我想在 div 关闭时添加页面刷新。我正在使用的代码如下。 var container_close_sec = "1
我有一组具有以下名称的页面.... update1.php update2.php update3.php update4.php update5.php update6.php update7.ph
如果是则触发js函数。我可以使一个复选框保持选中状态,并在页面刷新时检查值并选中“checked”,并提交以下内容... checked="checked" /> 你都不记得触发js函数。 这是我的
我正在尝试刷新 php 脚本以在数据库更新时显示更新的内容。我首先构建了我的 php,然后刷新代码,然后合并它们。但是,脚本不会更新。有谁知道为什么吗? $(document).ready
当我要删除的节点扩展集合类型时,Grails中有一个错误阻止我使用removeFrom *。直接从关联中删除节点不会更新二级缓存。 A hasMany B 有什么方法可以使关联缓存手动无效或强制重新加
我正在使用 hibernate 和 mysql 来抽象一个数据库,以便在 java 驱动的网站中使用。我使用 hibernate 很好地解决了所有查询,但似乎无法弄清楚如何使用它进行更新、插入和删除,
如何通过调用 oncreateview 方法重新创建 fragment ?我有一个 fragment ,用于通过表单插入新数据,单击按钮后,我想通过删除在 EditText 中输入的数据来重新创建 f
当我从一个到另一个时,我试图刷新我的观点。我知道我应该将刷新代码放在 viewWillAppear 中,但我不知道该放什么代码。 你们能帮帮我吗? 谢谢! 最佳答案 在您看来,请调用 setNeeds
我正在开发 iPhone 应用程序并希望使用: CFStreamCreatePairWithSocketToHost(NULL, url, port, &serverReadStream, &serv
看到我已经创建了一个用于登录用户的脚本。而且我还添加了设置选项卡,以便用户可以编辑他们的设置!但是当我尝试它时,mysql 表中的数据发生了变化,但配置文件中显示的用户名和用户电子邮件保持不变!当我注
好的。这就是它的样子。 当我启动应用程序时,我从服务器收到的第一件事是数据: {name: "test", type: "checkbox" checked: true, } 这使得其中一个复选框
我是一名优秀的程序员,十分优秀!