开发者

Anyone know how to get a browser status bar like the one in Digg.com?

开发者 https://www.devze.com 2023-03-16 10:03 出处:网络
If you have a look at digg.com, there is a persistent status bar (i.e. the Digg version number etc). I have played with a few jQuery plugins, but they don\'t anchor fully to the bottom like that one

If you have a look at digg.com, there is a persistent status bar (i.e. the Digg version number etc).

I have played with a few jQuery plugins, but they don't anchor fully to the bottom like that one in Digg.. I have tried to look at the CSS, but can't quite understand what bits are needed..

Any ideas/pointers very welcome?

<--- EDIT: SOLUTION --->

Thanks to the answer/comments below, I have ended up with the follow (just in case anyone else wants a basic working version to get going..):

The CSS is:

.footer-bar {
            background: -webkit-gradient(linear,left top,left bottom,from(#F3F3F3),to(white));
            background: -moz-linear-gradient(top,#F3F3F3,white);
            background-co开发者_如何学Pythonlor: white;
            border-top: 1px solid #AAA;
            bottom: 0;
            color: #333;
            font-size: .833333333333em;
            font-family: Arial Narrow;
            height: 12px;
            padding: 5px 0;
            position: fixed;
            right: 0;
            text-align: left;
            width: 100%;
            z-index: 5;
        }

Obviously you can change the relevant bits, and then of course in my case I just have the following HTML:

<span class="footer-bar">Some text in the footer/status bar that stays there even when you scroll</span>

So there you are - thanks to all the others and of course the guys who originally created it.. CSS is still a bit of a mystery in some cases to me!


You want position: fixed on the element. No JavaScript.

Fixed positioning makes the element relevant to the viewport.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号