MyBB Community Forums

Full Version: Browser Attached Bar?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
If you notice in the image below how they have a low opactiy attached black bar. With the UserCP options etc...


How would I add that to my theme? I couldn't find any tutorials online....


Thanks!

[attachment=20589]
Seems they've edited the welcomeblock to be a div that's absolutely positioned to the bottom.
(2010-11-22, 05:59 PM)MattRogowski Wrote: [ -> ]Seems they've edited the welcomeblock to be a div that's absolutely positioned to the bottom.
Yea I noticed that, but the question is how did they get it attached to the browser?

Also what template do you think they put it in? The index, or header?


It wouldn't be the index, then it'd only show on the index.

If they've just rewritten the code in the header_welcomeblock_member/guest templates, then it's still loaded in the header as usual but will just sit at the bottom. It'll be something like this:

<div style="position: absolute; bottom: 0; left: 0; width: 100%; height: 30px; opacity: 0.5;>Other HTML here</div>
(2010-11-22, 06:13 PM)MattRogowski Wrote: [ -> ]It wouldn't be the index, then it'd only show on the index.

If they've just rewritten the code in the header_welcomeblock_member/guest templates, then it's still loaded in the header as usual but will just sit at the bottom. It'll be something like this:

<div style="position: absolute; bottom: 0; left: 0; width: 100%; height: 30px; opacity: 0.5;>Other HTML here</div>
Then they used CSS to change the opacity etc correct?

Nevermind figured that out. But for some reason it doesn't follow when I scroll down on my browser.
Change absolute to fixed

Also I just saw I didn't close the style tag properly. This should work fine:

<div style="position: fixed; bottom: 0; left: 0; width: 100%; height: 30px; opacity: 0.5;">Other HTML here</div>
Okay thanks, now how would I change the color of the box?

That's my last question.
By the looks of it, they haven't changed the opacity of the div they have just done the background, as otherwise the text would be transparent.
<div style="position: fixed; bottom: 0; left: 0; width: 100%; height: 30px; background-image:url('semi-transparent-img.png');">Other HTML here</div>
So use a semi transparent png instead.
(2010-11-22, 06:49 PM)Prentice Wrote: [ -> ]By the looks of it, they haven't changed the opacity of the div they have just done the background, as otherwise the text would be transparent.
<div style="position: fixed; bottom: 0; left: 0; width: 100%; height: 30px; background-image:url('semi-transparent-img.png');">Other HTML here</div>
So use a semi transparent png instead.
Okay thanks for that Smile

Now how do I change the color for things like:
{$lang->welcome_back}  {$lang->welcome_current_time}  

I also want to add a image and change the size. I thought it was CSS but I'm not seeing it.
{$lang->welcome_current_time} Is actually just text, you want to look for the span or div tags and edit those.
Pages: 1 2