I've been wanting to achieve an effect like this for a while now, does anyone know any better examples than this: http://burciagraphy.com/ and also how I can achieve this effect?
If anyone can point me towards some tutorials / articles that would be very much appreciated
Thanks everyone, as @Paulie_D mentioned this doesn't solve the whole question. I should have worded my question better as I am actually looking for a way of making the background dynamic, how is the best way to achieve this carousel effect? I'd also appreciate any more tutorials / articles you can point me towards.
Well, i started to give it a stab and ended up giving up, mainly because i need to work on my other project lol but this was driving me bonkers. Below is a start at trying to recreate this, i really wish you wanted some javascript because doing this stuff in pure css3 is way out of my zone. Maybe you can get some ideas or something??
Thanks everyone for the great replies, I really appreciate all of your help!
After reading a few tutorials and working along side with them for the javascript I've managed to produce a homepage I'm very satisfied with. Although not similar to the one in the description I prefer this one as the design evolved during production.
Here's a link to a public dropbox account containing my code: My Site
One problem I'm currently having is changing the colour of the twitter feed ticker, if someone could explain how to change this I would appreciate that greatly.
I've been wanting to achieve an effect like this for a while now, does anyone know any better examples than this: http://burciagraphy.com/ and also how I can achieve this effect?
If anyone can point me towards some tutorials / articles that would be very much appreciated
Thanks,
http://css-tricks.com/perfect-full-page-background-image/
^ lol beat me to it..
http://css-tricks.com/perfect-full-page-background-image/
Yeah but that won't allow slider like actions which, AFAICT, is integral to the actual question.
Thanks everyone, as @Paulie_D mentioned this doesn't solve the whole question. I should have worded my question better as I am actually looking for a way of making the background dynamic, how is the best way to achieve this carousel effect? I'd also appreciate any more tutorials / articles you can point me towards.
Thanks,
http://buildinternet.com/project/supersized/
Good link.
I've never used Jquery so would prefer to stay away just for now, is there a pure CSS3 alternative?
Nope...you can't transition background images with CSS...AFAIK.
Might be an interesting project though.
@AdamHodgson,
Well, i started to give it a stab and ended up giving up, mainly because i need to work on my other project lol but this was driving me bonkers. Below is a start at trying to recreate this, i really wish you wanted some javascript because doing this stuff in pure css3 is way out of my zone. Maybe you can get some ideas or something??
Failed CodePen (hold down the next button)
However, stuff like that can be done i believe, like @Paulie_D had mentioned, this really will be an interesting project. But i scrounged up some links for you that may benefit your solution:
http://coding.smashingmagazine.com/2012/04/25/pure-css3-cycling-slideshow/
http://www.ryancollins.me/?p=1041
http://csswizardry.com/2011/10/fully-fluid-responsive-css-carousel/
I'l' give it another crack when i can take a break, until then, good luck!
Here is a old demo I did. Closest I have to that. So with it you have the basics to the css. You just need to add a small js next and previous button. http://www.websitecodetutorials.com/code/photo-galleries/css-body-scroller.php
Thanks everyone for the great replies, I really appreciate all of your help!
After reading a few tutorials and working along side with them for the javascript I've managed to produce a homepage I'm very satisfied with. Although not similar to the one in the description I prefer this one as the design evolved during production.
Here's a link to a public dropbox account containing my code: My Site
One problem I'm currently having is changing the colour of the twitter feed ticker, if someone could explain how to change this I would appreciate that greatly.
Thanks everyone, feedback welcome! :)
Are you using the "Twitter" twitter feed ticker or a custom one?
The one created by Chris from the CSS-Tricks forum.