顯示在屏幕頂部的span消息

我有一個div，裏面有span，它會在網頁上顯示消息。我希望該信息能夠顯示用戶在頁面中的位置。因此，可以說用戶在頁面底部一直滾動，我希望這條消息能夠顯示在他們可以在頁面上看到的最高點。謝謝你的幫助。顯示在屏幕頂部的span消息

2012-03-26 user516883

我相信你正在尋找

position:fixed

這裏有一個小例子：http://jsfiddle.net/8APrp/1/

來源

2012-03-26 00:58:26 dldnh

謝謝。真的有幫助 – user516883 2012-03-26 02:47:15

你會想在你的CSS中使用position:fixed你的div。

來源

2012-03-26 00:58:16 Gohn67

你有一個例子頁面，我可以退房？ – user516883 2012-03-26 00:58:59

你可以看看這裏的靜態，絕對，固定和相對的差異：http://www.w3schools.com/cssref/playit.asp?filename=playcss_position&preval=fixed唯一的缺點是不允許你改變值。但你應該明白這一點。 – Gohn67 2012-03-26 01:00:20

在此示例中，請參閱固定的操作，您需要將瀏覽器窗口更改爲非常小，以便您可以滾動並仍然看到紅色框。 – Gohn67 2012-03-26 01:01:27

是位置：固定在這裏例如http://www.w3schools.com/css/tryit.asp?filename=trycss_position_fixed

來源

2012-03-26 01:05:39 user1289347

對不起，：位置：固定並不受所有瀏覽器支持。更好的選擇是：

<html> 
    <head> 
    </head> 
     <body> 
     <div id='top_message'></div> 
     <div id='main_container'></div> 
     </body> 
</html>

CSS：

body 
{ 
    overflow:hidden; 
} 

#top_message 
{ 
    position:absolute; 
    top:0px; 
    left:0px; 
    width:100%; 
    height:30px; 
    display:block; 
} 

#main_conatainer 
{ 
    position:absolute; 
    top:30px; 
    left:0px; 
    width:100%; 
    height:100%; 
    overflow:scroll; 
}

來源

2012-03-26 01:29:07

因此，您可以看到，我們創建了2個容器，其中1個用於消息div，另一個用於網站的主要內容。這樣做需要更長的時間，但它確保了與所有瀏覽器和大多數DOCTYPES的兼容性 – 2012-03-26 01:35:34

顯示在屏幕頂部的span消息

回答

相關問題