Member Avatar

pls! help me :( i want to make a webpage that have one picture-background only and it is flexible to the size of my window browser without loosing there quality.. help help me guys!!!!

  • 5 Contributors
  • forum 8 Replies
  • 111 Views
  • 1 Month Discussion Span
  • comment Latest Post Latest Post by anand01

Recommended Answers

Answered by stbuchok 123 in a post from

Everything you need should be here:

http://www.w3schools.com/css/css_background.asp

Jump to Post
Answered by anand01 0 in a post from

body
{
background-image:url('image Url');
background-repeat:no-repeat;
}

Add this code in Ur css

Jump to Post

All 8 Replies

Member Avatar

body
{
background-image:url('image Url');
background-repeat:no-repeat;
}

Add this code in Ur css

Member Avatar

stbuchok and anand01 thankyou for idea, but what i want happen is when i scroll down or up, my background is still the same? how can i code that...like this one http://www.ayalaland.com.ph/

Member Avatar

This is one of the things on the page I sent you. Please go read all of them, it is the example at the bottom of the page.

body
{
background-image:url('image Url');
background-repeat:no-repeat;
background-attachment:fixed;
}
Member Avatar

hi guys you use a this one coding in a your design page follow this one

body
{
background-image:url('image Url');
background-repeat:no-repeat;
}

Add this code in Ur css

Edited by edesigner because: n/a
Member Avatar

add this cod also for fixed image

background-attachment:fixed;

Member Avatar

These codes will allow you to have a fixed image background.
It will adjust along with the browser window size, also image will adjust to the length of the webpage.

Place these 2 scripts after the <title> </title> tag's, and before the </head>

<style type="text/css">
html, body {height:100%; margin:0; padding:0;}
#page-background {position:fixed; top:0; left:0; width:100%; height:100%;}
#content {position:relative; z-index:1; padding:10px;}
</style>
<style type="text/css">
html {overflow-y:hidden;}
body {overflow-y:auto;}
#page-background {position:absolute; z-index:-1;}
#content {position:static;padding:10px;}
</style>

Place this line of code anywhere within the <body> </body> tag's.

<div id="page-background"><img src="(File name)" width="100%" height="100%"></div>
Member Avatar

hope U got the solutions

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.20 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.

Sign Up — It's Free!