Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Jul 2010
    Location
    Arizona
    Posts
    111
    Thanks
    14
    Thanked 0 Times in 0 Posts

    making background image fixed

    Hi, i was wondering if anyone could help me make my background image fixed and have the stuff on top of it scroll. I've tried to add background-attachment:fixed; to my bg element and bg img element and mainimg element. Here's what i have please help.

    main.css:
    Code:
    html, body {
        height:100%;
        margin:0;
        background-color:#000;
        background-image:url(../images/firstpage.gif);
        background-size:100% 100%;
        background-repeat:no-repeat;
        
        
        border:0;
        padding:0; 
     }
    defult.css:
    Code:
      body {
           margin:0; padding:0;
    	   background:#000000;
    	   
       }
       html, body, #bg {
           height:100%;
           width:100%;
           
           border:0;
           padding:0;
       }
       #bg {
           position:absolute; 
           left:0;
           right:0;
           bottom:0;
           top:0;
           background-attachment:fixed;
           z-index:0;
       }
       #bg img {
           width:100%;   
           height:100%;
    	background-attachment:fixed;   
       }
    defult2.css:
    Code:
     body {
           margin:0; padding:0;
    	   background:#000000;
    	   
       }
       html, body, #bg {
           height:100%;
           width:100%;
           
           border:0;
           padding:0;
       }
       #bg {
           /*position:absolute; */
           left:0;
           right:0;
           bottom:0;
           top:0;
          background-attachment:fixed;
           z-index:0;
       }
       #mainimg {
           width:100%;   
           height:100%;
           background-attachment:fixed;
       }
    html:
    Code:
    <div id="bg" >
    
       <img style="display:block;" id="mainimg"  src="images/firstpage.gif"/>
       
       
    </div>

    thank you

  • #2
    Regular Coder
    Join Date
    Jul 2010
    Location
    Arizona
    Posts
    111
    Thanks
    14
    Thanked 0 Times in 0 Posts
    the page is www.marksbodyshop.org

  • #3
    Regular Coder
    Join Date
    Jul 2010
    Location
    Arizona
    Posts
    111
    Thanks
    14
    Thanked 0 Times in 0 Posts
    i got it nevermind i added position:fixed; to the elements in the css but i added background-attachment:fixed; to the main.css


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •