Javascript Disabled Detected

You currently have javascript disabled. Several functions may not work. Please re-enable javascript to access full functionality.


Welcome to KnowledgeSutra - Dear Guest , Please Register here to get Your own website. - Ask a Question / Express Opinion / Reply w/o Sign-Up!

0

Fixed Background

Started by doomforge, Dec 24 2006 07:16 PM

Reply to this topic

5 replies to this topic

#1 doomforge

Newbie [Level 1]

Kontributors
15 posts

Posted 24 December 2006 - 07:16 PM

A while ago i was wondering how to make a fixed (static)* background and so i thought that other people might also want to know how to do it...the good news, it's a lot easier than you think :lol:

the code goes like this:

<body background="URL OF BACKGROUND IMAGE" bgproperties="fixed">

* a fixed or static background is a background that does not move while all the website content above it moves (ie text pictures etc.) an example would be some thing like this

example web site

so have fun giving your website some really cool effects

#2 jlhaslip

Insert Custom Title Here

[MODERATOR]
5,040 posts

Gender:Not Telling
Location:Linux, DOS and Windows…the good, the bad and the ugly
myCENT:81.07

Posted 25 December 2006 - 04:28 AM

Here is a sample of CSS code that I use on a site to "freeze" a background gif at a specific location on the page. The gif is about 20 percent opaque, so it is really faint on the screen and it doesn't move when the page scrolls.

body {
     background-color: #dfffdf;                                      // set the colour for the page
     background-image: url('images/opac_logo.gif');        // select the image
     background-repeat: no-repeat;                                // no repetition of the image
     background-attachment: fixed;                                // fix the image on the page
     background-position: 50% 75%;                              // at this spot, play with it...
     }

When I view your page, the image was repeated and didn't "freeze" itself on the page. If you want that to happen, feel free to borrow from the code I have posted.

#3 ETCZ

Newbie

Kontributors
4 posts

Posted 16 January 2007 - 05:51 AM

Well that is certainly a good bit of code you have provided and I wish to thank you for sharing it with the Forum membership. I had planned on learning this technique and now that I have found it here, I will be able to use it on the next version of my webite which I hope to get Hosted here at the trap17 Free Web Hosting service. As long as I am careful about posting non-spam postings and writing good quality posts, I should be abe to earn enough Hosting credits shortly, then I will have a nice fixed image on the background of my page.

Edited by jlhaslip, 16 January 2007 - 06:35 AM.

#4 matak

Super Member

Kontributors
416 posts

Location:Psychedelic Realms
Interests:Psychedelic

Posted 16 January 2007 - 02:16 PM

i kinda guess that this works for all backgrounds not only body?! and with that you can set background-position: 50% 75%; in pixels too.. haven't tried it, it's a wild guess..

#5 hts

Advanced Member

Kontributors
138 posts

Location:Iasi, Romania

Posted 16 January 2007 - 10:52 PM

of course matak, in css you can specify sizes in: px, %, em (these are widely used)
also, you can define for any element a background

learn css, it is a very powerful "tool" to build your site

#6 iGuest

Hail Caesar!

Kontributors
5,876 posts

Interests:Trap17 Free Web Hosting, No Ads

Posted 04 January 2010 - 04:42 PM

Page Background Behavior ProblemFixed Background

First of all, I am using Dreamweaver CS4. I have created a page in which the background image remains fixed as I scroll down the page (Background-Repeat: Repeat; Background-Attachment: Fixed). When I preview in Browser it works fine, but when I leave the page and then return, or initially enter from another page, it does not work. I have tried finding a solution on Dreamweaver tutorial and help pages but have not been able find anything that will help. Please help.Chris Keiser

-question by Chris Keiser

Back to HTML, XML etc.. · Next Unread Topic →

Reply to this topic

1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users