Tutos
Get flash to fully experience Pearltrees
Elastic Image Slideshow with Thumbnail Preview | Codrops
Today we want to show you how to create a simple elastic slideshow with a thumbnail preview. The slideshow will adjust automatically to its surrounding container and we can navigate through the slides by using the thumbnail previewer or the autoplay slideshow option. The fabulous photography used in the demo is by Bartek Lurka and it is licensed under the Attribution-NonCommercial-NoDerivs 3.0 Unported License . We will create two unordered lists, one for the main slider and one for the thumbnail navigation beneath the large image.
With my background image I tried to create a totally random/crazy chess board of changing images. In order to try and not make it look like one image repeated across the screen I first had to make my background tile a square of nine images in one. 2. Create different versions I then created five different versions of my background tile; each one with a different illustration in each square.
How to make a super simple animated background | Tutorial | .net magazine
Responsive Image Gallery with Thumbnail Carousel | Codrops
A tutorial on how to create a responsive image gallery with a thumbnail carousel using Elastislide. Inspired by Twitter's "user gallery" and upon a request to show an integration of Elastislide, we want to implement a responsive gallery that adapts to the view-port width. The gallery will have a view switch that allows to view it with the thumbnail carousel or without. We'll also add the possibility to navigate with the keyboard. View demo Download source
Tutos HTML5
Tutos CSS
Behind The Scenes Of Nike Better World - Smashing Magazine
Perhaps one of the most talked about websites in the last 12 months has been Nike Better World 1 . It’s been featured in countless Web design galleries, and it still stands as an example of what a great idea and some clever design and development techniques can produce. In this article, we’ll talk to the team behind Nike Better World to find out how the website was made. We’ll look at exactly how it was put together, and then use similar techniques to create our own parallax scrolling website. Finally, we’ll look at other websites that employ this technique to hopefully inspire you to build on these ideas and create your own variation.