Full Screen Responsive Background
Thinking about creating a portfolio? why not impress your visitors with a nice responsive full screen background image.
Full Screen Background
The majority of people would achieve this effect by implementing jquery and a third party plug-in. The code I’m about to explain is just CSS which delivers the same results. The code looks like this.
background-position: right bottom;
The interesting CSS attribute we are using is “Background-Size:Cover”, this attribute scales the image to the smallest size such that both its width and its height can fit inside the content area.
Check Out The Demo
You can see how it performs by checking the demo below.
Try it out for yourself, feel free to post up your examples in the comments area below.
Give Us Your Feedback
Here on Photoshop Plus we use something called Gravatar, its a little image which will appear next to your name when you comment on a blog. Using a gravatar will help us recognise genuine comments from the spam comments.
Don't forget to leave a comment on this post, we appreciated your feedback good or bad.