最近facebook下邊加了一個固定的功能表,
無論怎樣滾動頁面, 那個功能表也不會移位,
可以用樣式表(CSS)做出來嗎?
我在網上找到的劇本(javascript)要靠設定間距set interval來計算並移正功能表, 是會有走位的現像, 我相信一定有其他辦法的.
facebook下邊的menu bar HTML怎樣做?
2008-11-10 5:54 am
回答 (2)
2008-11-13 4:30 pm
✔ 最佳答案
Fixed layer with CSS "overflow: auto" This is a simulation of CSS "position: fixed" for MSIE. The main text on this page is contained in a 100% high, scrollable <div>. The scrollbar belongs to the <div>, not to the <body>. The ordinary <body> content is found in the fixed green box. All HTML and CSS on this page should follow the W3C spec except overflow-y: hidden, which is used for cosmetical purposes in earlier IE versions.
********************************
<style type="text/css">
<!--
body {margin: 0; padding: 0; font-size: 100%;}
li {margin: 0.5em; }
code {background: #fff; color: #4B0082; }
div.innerbox {padding: 4em 5%; }
div.fixedcontent {position: fixed; z-index: 2; top: 1em; left: 5%; width: auto; padding: 0.3em; border: 5px dashed; color: #000; background: #cfc; }
.fixedcontent p {margin: 0; padding: 0;}
-->
</style>
<!--[if gte IE 5]>
<style type="text/css">
html,body {height: 100%; overflow-y: hidden;} /* Prevents double scrollbars. */
div.scrollingcontent {height: 100%; width: 100%; overflow: auto; margin: 0; padding: 0; }
div.fixedcontent {position: absolute; z-index: 2; }
</style>
<![endif]-->
</head>
<body>
<div class="scrollingcontent">
<div class="innerbox">
<h1>
Fixed layer with CSS "overflow: auto"
</h1>
<p>
This is a simulation of CSS "position: fixed" for MSIE. The main text on this page is contained in a 100% high, scrollable <code><div></code>. The scrollbar belongs to the <code><div></code>, not to the <code><body></code>. The ordinary <code><body></code> content is found in the fixed green box.
All HTML and CSS on this page should follow the W3C spec except <code>overflow-y: hidden</code>, which is used for cosmetical purposes in earlier IE versions.
</p>
********************************
2008-11-10 6:44 am
用 layer
<LAYER>
ID="layerName"
LEFT="pixelPosition"
TOP="pixelPosition"
PAGEX ="pageX"
PAGE"="pageY"
SRC="file"
Z-INDEX="n"
ABOVE="layername"
BELOW="layername"
WIDTH="width"
HEIGHT="height"
CLIP="n,n,n,n"
VISIBILITY="visibility"
BGCOLOR="color"
BACKGROUND="imageURL"
OnMouseOver="JScode"
OnMouseOut="JScode"
OnFocus="JScode"
OnBlur="JScode"
OnLoad="JScode"
</LAYER>
<LAYER>
ID="layerName"
LEFT="pixelPosition"
TOP="pixelPosition"
PAGEX ="pageX"
PAGE"="pageY"
SRC="file"
Z-INDEX="n"
ABOVE="layername"
BELOW="layername"
WIDTH="width"
HEIGHT="height"
CLIP="n,n,n,n"
VISIBILITY="visibility"
BGCOLOR="color"
BACKGROUND="imageURL"
OnMouseOver="JScode"
OnMouseOut="JScode"
OnFocus="JScode"
OnBlur="JScode"
OnLoad="JScode"
</LAYER>
收錄日期: 2021-04-13 16:14:02
原文連結 [永久失效]:
https://hk.answers.yahoo.com/question/index?qid=20081109000051KK02360