很抱歉不得不问另一个position:fixed相关的问题,但阅读各种其他问题和论坛帖子并没有帮助我解决这个问题.
下面的代码简要演示了我迄今为止position:fixed在项目中的使用方式.我最初(错误)的理解position:fixed是它最初修复了相对于第一个定位的父容器,然后无论视口滚动位置如何都保持在该位置.我现在意识到这是错误的:事实上,position:fixed相对于最外面的容器(即html标签)的position:absolute位置和相对于具有不同位置的第一个父容器的位置static.
通过阅读关于SO的各种其他问题,我意识到我试图实现的效果position:fixed是许多其他人尝试过的效果,但后来意识到只用CSS就不可能:也就是说,相对于容器定位一个元素,但是当页面滚动时,它会保持在相对于视口的位置.
令我困惑的是,上面的内容正是我似乎已经实现的 - 至少在FF和IE8上.使用下面的代码示例,"固定的右窗格内容"最初位于红色"中心可滚动内容"框的右侧,并且与中心内容的顶部垂直对齐.中心内容可以滚动,但右手内容保持原样,就好像它最初在正常文档流中静态定位但此后保持固定在视口中.
我现在意识到这似乎在IE8和FF中"工作"只是因为我没有为元素指定top/ bottom/ left/ right属性fixed.如果我这样做,那么我意识到fixed元素会立即相对于视口定位.
我曾经假设 - 也许是危险的 - 直到现在如果没有指定相对位置,那么position:fixed默认情况下将该元素放置在通常静态放置的位置.至少FF和IE8似乎正在这样做.
但是,在Safari中进行测试表明Safari似乎将该fixed元素放在其容器的左侧.换句话说,没有定位,我的position:fixed元素既不是静态放置的位置,也不是相对于视口位于0,0.
到目前为止,我是否一直依赖于定义非常糟糕的行为,我最好是依靠JavaScript解决方案来实现这种固定定位?或者,这种行为是否为IE/FF定义良好; 有人可以解释Safari的位置背后的逻辑吗?
<style type="text/css">
#content-centre {
margin: 0 auto;
width: 900px;
}
#header {
height: 55px;
position: fixed;
top: 0;
width: 990px;
}
#left-pane {
position: fixed;
top: 12px;
border: 1px green solid; …Run Code Online (Sandbox Code Playgroud)由于元素margin-left: -10px的边缘与其父元素的边缘相交,为什么不会发生同样的情况margin-right: -10px呢?
div {
background: red;
width: 200px;
height: 100px;
}
p {
background: blue;
width: 100%;
}
.left {
margin-left: -10px;
}
.right {
margin-right: -10px;
}Run Code Online (Sandbox Code Playgroud)
<div>
<p class="left">Hello</p>
</div>
<div>
<p class="right">Hello</p>
</div>Run Code Online (Sandbox Code Playgroud)
我有一个猫鼬文档,我想用另一个对象更新它的许多字段。就像是
Model.findById(_id, function (err, doc){
var updateData = {...data}
// i do not want to do
doc.foo = data.foo;
doc.bar = data.bar;
// i need something like
doc.save(updateData)
// or
doc.update(updateData)
// or
doc = {...doc, ...updateData}
doc.save();
});
Run Code Online (Sandbox Code Playgroud)
updateData 是一个包含我需要在文档中更新的所有数据的对象。
没有找到任何相关的文档,最接近的是找到并更新...