javascript - 使消息始终在顶部

Question

我想制作一条始终位于顶部的消息，但使用 java 脚本滚动页面。我尝试了下面的代码，但是当我滚动它时它仍然在它的静态位置

var message = '<b><font color=000000 size=5>mona <a href="../link.htm">link to us</a>!          </font></b>'
//enter a color name or hex to be used as the background color of the message
var backgroundcolor = "#FFFF8A"

//enter 1 for always display, 2 for ONCE per browser session
var displaymode = 1

//Set duration message should appear on screen, in seconds (10000=10 sec, 0=perpetual)
var displayduration = 0

//enter 0 for non-flashing message, 1 for flashing
var flashmode = 1
//if above is set to flashing, enter the flash-to color below
var flashtocolor = "lightyellow"
var ie = document.all
var ieNOTopera = document.all && navigator.userAgent.indexOf("Opera") == -1
function regenerate() {
window.location.reload()
}

function regenerate2() {
if (document.layers)
    setTimeout("window.onresize=regenerate", 400)
}

var which = 0

function flash() {
if (which == 0) {
    if (document.layers)
        topmsg_obj.bgColor = flashtocolor
    else
        topmsg_obj.style.backgroundColor = flashtocolor
    which = 1
}
else {
    if (document.layers)
        topmsg_obj.bgColor = backgroundcolor
    else
        topmsg_obj.style.backgroundColor = backgroundcolor
    which = 0
}
}

if (ie || document.getElementById)
document.write('<div id="topmsg" style="position:absolute;visibility:hidden">' + message + '</div>')

var topmsg_obj = ie ? document.all.topmsg : document.getElementById ? document.getElementById("topmsg") : document.topmsg

function positionit() {
var dsocleft = ie ? document.body.scrollLeft : pageXOffset
var dsoctop = ie ? document.body.scrollTop : pageYOffset
var window_width = ieNOTopera ? document.body.clientWidth : window.innerWidth - 20
var window_height = ieNOTopera ? document.body.clientHeight : window.innerHeight

if (ie || document.getElementById) {
    topmsg_obj.style.left = parseInt(dsocleft) + window_width / 2 - topmsg_obj.offsetWidth / 2
    topmsg_obj.style.top = parseInt(dsoctop) + parseInt(window_height) - topmsg_obj.offsetHeight - 4
}
else if (document.layers) {
    topmsg_obj.left = dsocleft + window_width / 2 - topmsg_obj.document.width / 2
    topmsg_obj.top = dsoctop + window_height - topmsg_obj.document.height - 5
}
}

function setmessage() {
if (displaymode == 2 && (!display_msg_or_not()))
    return
if (document.layers) {
    topmsg_obj = new Layer(window.innerWidth)
    topmsg_obj.bgColor = backgroundcolor
    regenerate2()
    topmsg_obj.document.write(message)
    topmsg_obj.document.close()
    positionit()
    topmsg_obj.visibility = "show"
    if (displayduration != 0)
        setTimeout("topmsg_obj.visibility='hide'", displayduration)
}
else {
    positionit()
    topmsg_obj.style.backgroundColor = backgroundcolor
    topmsg_obj.style.visibility = "visible"
    if (displayduration != 0)
        setTimeout("topmsg_obj.style.visibility='hidden'", displayduration)
}
setInterval("positionit()", 100)
if (flashmode == 1)
    setInterval("flash()", 1000)
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = ""
if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) {
        offset += search.length
        end = document.cookie.indexOf(";", offset)
        if (end == -1)
            end = document.cookie.length;
        returnvalue = unescape(document.cookie.substring(offset, end))
    }
}
return returnvalue;
}

function display_msg_or_not() {
if (get_cookie("displaymsg") == "") {
    document.cookie = "displaymsg=yes"
    return true
}
else
    return false
}

if (document.layers || ie || document.getElementById)
window.onload = setmessage

任何帮助。或任何新代码

Answer 1

如果我理解你想要什么，我认为你完全想多了。您可以使用 CSS 将消息固定在页面顶部。只需添加位置:固定。这就是我如何让我的标题停留在这个网站页面的顶部:http://www.recipegraze.com

因此使用 javascript 使消息出现/消失，但使用一些简单的 CSS 使其固定在页面顶部。

编辑:您还需要提高消息的 z-index 以确保它显示在其他内容的顶部，而不是在其下方。