+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: Background won't stay as background. (/showthread.php?tid=5542489)
Background won't stay as background. - Hexurp - Feb 4, 2017
I have a moving background on my site. I have a black background and than a moving javascript image that moves and interacts with the mouse. It covers all of my forms and footer on my site. I can't get it to actually be behind EVERYTHING. Any idea?
* - Nerdi - Feb 4, 2017
This is a bad idea...
this is very old fashioned web design and not popular anymore. Please don't do this. I cannot help you because I would feel like I did the world a disservice by encouraging this type of web design.
The designs you're speaking about consistently have issues with mobile devices, various browsers, and people's eyeballs. Please, for the love of all that is nerdy and great, do not do this.
* - Web_Development - Feb 4, 2017
What you are looking for is probably "z-index".
Search on Google how to use it.
* - Jamboz - Feb 4, 2017
you must have the background container in the <body> tags and not inside any other tags and also set z-index to less than any other div on the top level.
* - Hexurp - Feb 4, 2017
I got this to finally work. I used z-index to fix it. I actually didn't even know z-index was a thing. Wish I came back and checked Web_Developments reply sooner and saved hours of looking around and testing. As for Nerdi, the background actually works flawlessly on all browsers and tested and my phone. Maybe we was thinking about something different? Anyways thanks everyone for the help!
* - Fortified Design - Feb 6, 2017
Background-size: 100vw 100vh; position:fixes;
The 100vw and 100vh will make it 100% of the visiable screen even if use users resolution is different. And position: fixed will make it stay in the same place on the screen when the user scrolls.. Set that on body or the container you are using.