Fluid Header?

[Biggles LLB]

BTW, when is one of you gunna sort out my fluid header problem for me?

To see the snag (stretching and/or repetition of header at some settings and on some monitors) go to:


http:www.education-issues.net/forums

One or two have offered to help but they are too busy at present to fix it for me.

Happy to pay reasonable fee for help. Quotes please, to:

mike@education-issues.org

Regards

Biggles LLB

[Joeychgo]

For starters, you need one or two graphic images that ont stretch, and a horizontally staticl appearance.

For example.... On the left I have:

http://www.team-2g.com/mitsubishi-eclipse/images/Header/mitsubishi-left.gif

then for the rest I have:

http://www.team-2g.com/mitsubishi-eclipse/images/Header/mitsubishi-slice.gif

the second image is the background and is repeated across the rest of the screen, regardless of how wide.


Thats a site that has a left banner - then just stretches across.

Now, for a 3 piece, I have this on the left:

http://www.forabodiesonly.com/mopar/images/abodybannerLeft.jpg

this in the middle:

http://www.forabodiesonly.com/mopar/images/abodybannerSlice.jpg

and this on the right:

http://www.forabodiesonly.com/mopar/images/abodybannerRight.jpg

The middle piece stretches the width.

[Biggles LLB]

Hey thanks Joey, thus far I follow perfectly.

Do I take it, then, that the examples above are for a two, then a three, column layout?

I can insert images (and believe me when I say that it took me a while!), so how do I get the stretchable image to spread, or stretch, as required? I mean, is there a need for any special php or html coding or can I just insert it into the appropriate part of a 2 or 3 column header and, viola, it will stretch as required on any resolution setting and in any OS?

For what my opinion is worth, I reckon this new site of yours is going to be a real winner. Especially when there are guys here like you, willing to pass on some of your skills and knowledge for the benefit of others less knowledgeable. It has much in common with your previous site, of course, but is far better on the eye. It's a really nice looking site. ;)

Thanks again.

Biggles LLB :cool:

[Biggles LLB]

Right. Having played around for hours, the penny finally dropped and I have now got the makings of a ... Fluid Header! Yaay!

Three cheers for Joeychgo. :D :D :D

For the oldies like me, the skinny little image Joey showed us above goes on the page as the background image just like it is and expands across the page whatever its size. The fixed image (the one you don't want to distort) goes in like any other image.

I had to change my background from a sunburst to a horizontally linear image, then paste the sad boy image over the top as a transparency. I added the text and, hey presto, a fluid header.

Still working on it in Dreamweaver to iron out some wrinkles. Question next is: how does this work for putting the darned image into vB?

Many thanks Joey. That's a beer or ten I owe you! ;)

Regards

Biggles LLB

[Brandon Sheley]

great tutorial Joey :)

I already knew about this, but I remember when I didn't and was in the same spot Biggles LLB is, it took me a while to figure this out.

[Peggy]

I'm glad y'all got this, it went right over my head. and before anyone asks, no I'm not blonde I'm auburn ;)

[Biggles LLB]

Lol ... I would explain babydoll. But I'm not really sure how to do that even. All I know is that it makes sense now that I've made it work. :D

We can see you're not a blonde, btw, but we don't care - coz we luvs ya anyways ya come, blonde, brunette, or pink even. :p

But beware, lads and laddesses. I've now got two problems flowing from the fluid header problem (Get it!? Sheesh!). :eek:

One; the fluid header looks great now, see http://www.educationissues.net , but the text column is sitting off to the left on widescreen monitors. Looks nice on mine but my wife's laptop is better than mine and the site looks daft on hers.

Two, I can't work out how to insert the fluid background into my vB BB at: http://www.education-issues.net Do I need to insert php code? If so, I'm gunna still need some help. Willing to pay.

Never mind. I feel like I have made some progress thanks to Joey and his careful explanation. No more 'powered by vBulletin' and now a fluid header on my Dreamweaver created site. Things are on the up thanks to vBulletin-FAQ.

Back to the drawing board on the BB. Mutter, mutter ... mumble, mumble ... curse, curse ... sniff, sniff :rolleyes:

Thanks all

Biggles LLB :cool:

[Peggy]

see? told you this was a great place to be *wink*

[John]

Lol ... I would explain babydoll. But I'm not really sure how to do that even. All I know is that it makes sense now that I've made it work. :D

We can see you're not a blonde, btw, but we don't care - coz we luvs ya anyways ya come, blonde, brunette, or pink even. :p

But beware, lads and laddesses. I've now got two problems flowing from the fluid header problem (Get it!? Sheesh!). :eek:

One; the fluid header looks great now, see http://www.educationissues.net , but the text column is sitting off to the left on widescreen monitors. Looks nice on mine but my wife's laptop is better than mine and the site looks daft on hers.

Two, I can't work out how to insert the fluid background into my vB BB at: http://www.education-issues.net Do I need to insert php code? If so, I'm gunna still need some help. Willing to pay.

Never mind. I feel like I have made some progress thanks to Joey and his careful explanation. No more 'powered by vBulletin' and now a fluid header on my Dreamweaver created site. Things are on the up thanks to vBulletin-FAQ.

Back to the drawing board on the BB. Mutter, mutter ... mumble, mumble ... curse, curse ... sniff, sniff :rolleyes:

Thanks all

Biggles LLB :cool:You need to create an image that can be stretched to use on either side of the existing header image Biggles. There is nothing in your existing header image as it stands that can be moved without distorting it. You might want to consider creating a new header or getting one created for you.

I am happy to do this for you - but I'd charge for this as it would take a me a little while to design, code and install for you - not much, but I would have to charge. You might want to ask around the various vB communities first if you don't want to pay someone to do this. If you do want a header designed, coded and installed for you: simply PM me here on vBFAQ, or email me on themusicman@gmail.com with design spec details and I will provide a quote for you.

John

[Peggy]

He did offer to pay, in his original post......

[John]

I made a new vBulletin header template for you using the existing educationissues.net images. Check your PM's, it is in there...

Enjoy :)

[Peggy]

yaaayyy can't wait to see it :D

[Biggles LLB]

Thank you very much, John :)

It is now up there with just one tiny problem: the width. The header is wider now than the boxes beneath - not a serious problem but it stays too wide even after I changed my widths from 95% to 100%

I had to create a new image coz, as I wrote, the one from the other site is quite specific to that site.

So, for the benefit of others, after I produced the new image, I uploaded that and its skinny to the site so that it was in the relevant folder. Then I edited your code only so far as I had to put a hyphen between 'education' and 'issues' on the image addresses so that they were then correct. Crossed my fingers and took a tentative peek.

Great! A fluid header now on the BB. Sorted in the blink of an eye. What a dude you are, John. I concur that the quality is not up to your standard, but then neither am I - so it'll do just fine.

Again, many thanks. I'll send a pressie shortly via PP.

Biggles LLB

[Peggy]

how about a link to your site so we can see??

[Biggles LLB]

Hiya babydoll

Yes, no problem. The links are posted above but happy, and honoured, to repeat them:

Static site: http://www.educationissues.net

vB BB site: http://www.education-issues.net

I intend to improve on the images - when I get time. But it's looking better now. Still have a problem with uncentred text boxes on the static site on widescreen monitors. Working on that next.

Best wishes to all at vBulletin-FAQ, THE place to hang out, whether experienced or not as a webmaster. The company here is simply amazing. Thanks for the invite Ohio baby. It's everything you promised and more.

Now, pass the coffee, dudes. I need a boost (matchsticks back in place). ;)

Best wishes - and respect!

Biggles LLB :cool:

[John]

I shall be staying overnight in a few hotels during the next few weeks Biggles and will make a note to have a go at designing a new header for ya. Let's see what I come up with.

[Peggy]

hotel, eh?? :p

[John]

hehe....;)

I've just secured a wonderful 3 month contract - starting tomorrow - for a new client 120 miles away, and though I will be travelling up each day by train I am sure there will be the odd occasion when I work late and will stay overnight locally.

My new company www site www.PMCymru.com for details...

[Peggy]

hhmmmmmmmmmmmmm... (looking at the phone) heheheh

[Biggles LLB]

Heya John

I see this company is in Newport. You won't have much fun in a hotel in Newport - unless you know the terrain!

That's not far from where I live (7 miles inland from Weston-super-Mare). If you want me to buy you an ale or three, let me know. I'd enjoy the drive. :)

It would be fantastic if you can spare the time to do a design for the headers on my sites.

Thank you so much. Very grateful.

Biggles LLB :cool:

[John]

Yes, I actually live in Newport... have done all my life, not such a bad place - I like it:)

As for PM Cymru Ltd. - I have been a professional Project Manager for 18 years and decided it was about time I did this for myself instead of for an employer. I am fortunate enough to have managed to secure a contract even before I started promoting it to the world...:) I now also need to draft a marketing campaign for promoting my services on a high volume low capacity basis - based on the requirements of local/regional businesses.

All happening rather quickly this....:) good though!