Fold Tester: Where’s the Fold?

FoldTester can help answer the questions about where your site’s content will show up for different percentages of the world’s internet browsers. Based on data gathered from millions of internet users, the graphics on this site will help you lay out content accordingly.

Fold Tester: Where's the Fold?

The percentages on the screen indicate the percentage of the world’s internet users that are covered at that viewport size, taking into account window size, toolbars, and so forth.

Source Website

Spur: A Fun and Easy Way to Critique your Visual Design

Spur is a fun and easy way to critique web designs in ways you’ve never done before. Just paste a URL (or upload an image) and you’ll be able to use seven different tools to help you find what’s working (and what isn’t!).

Spur: A Fun and Easy Way to Critique your Visual Design.

How do I use it?

Just type in a URL and press Enter. If your design isn’t live yet, use our image uploader to add a mockup to Spur. You can share your altered image using a unique URL or upload it directly to Notable as a new post.

Source Website

WebGL Globe: Geographic Data Visualization Platform meant for the Web

The WebGL Globe is an open platform for geographic data visualization created by the Google Data Arts Team. They encourage you to copy the code, add your own data, and create your own globes. Check out the examples here: http://www.chromeexperiments.com/globe

WebGL Globe: Geographic Data Visualization Platform meant for the Web

The WebGL Globe supports data in JSON format.

Source Website & download

A Free Anniversary eBook Treat from Smashing Magazine

To honor the Fifth Anniversary occasion, Smashing Magazine have a humble gift for you: the free “Best of Smashing Magazine” Anniversary eBook. The eBook contains the best articles that have been published on Smashing Magazine in the last five years — and by “best,” we mean the most useful, most interesting or most inspiring. The articles have been carefully edited, proofread and updated for your convenience and reading pleasure on your eBook reader.

A Free Anniversary eBook Treat from Smashing Magazine

Source Website & download

Getting Started With The PayPal API by Smashing Magazine

PayPal is the most popular platform for receiving online payments today. The ease of opening a PayPal account and receiving payments compared to opening a merchant account with a traditional payment gateway is probably the number one reason for its popularity, with a close second being the comprehensive API that PayPal provides for its payment services. In this post, Smashing Magazine will break down some of the techniques and approaches to working with the PayPal API, in order to make integration and troubleshooting simpler and easier.

Getting Started With The PayPal API by Smashing Magazine

Full Tutorial

HTTP Cookie Handling for jQuery by Codrops

jCookies, a jQuery plugin, makes getting and settings HTTP Cookies a breeze. jCookies allows the storage of any type of data: strings, arrays, objects, etc. Data is stored in the cookie as JSON data then Base64 encoded to enable the survival through transport layers that are not 8-bit clean. JSON and base64 functions are included in the script and if trimmed out, provided they exist elsewhere, would reduce the size by 70%.

HTTP Cookie Handling for jQuery by Codrops

Source Website & download

Slicebox: A Fresh 3D Image Slider with Graceful Fallback by Codrops

With the CSS3 3D transformations we can create some neat effects by transforming elements in three-dimensional space. Slicebox makes use of the 3D transforms properties and allows different kind of effects. The main idea is to create three-dimensional image slices that will rotate and reveal the next image as another side of the 3d object. In case the browser does not support 3D transformations, a simple slider will be used as fallback.

Slicebox: A Fresh 3D Image Slider with Graceful Fallback by Codrops

Please note that you can only see the cool 3d effect of Slicebox in a browser that supports those CSS3 properties (currently Chrome and Safari).

View Demo  Source Website & download

Automatic Image Montage with jQuery by Codrops

Arranging images in a montage like fashion can be a challenging task when considering certain constraints, like the window size when using fullscreen, the right image number to fill all the available space or also the size of the images in use. With the following script you can automatically create a montage, either for a liquid container or a fixed size container (including fullscreen), with the option to fill all the gaps. Having a white space in the end of the container can, as well, be avoided optionally. The last image of the montage can fill the left space, so that the montage will be left gap-less.

Automatic Image Montage with jQuery by Codrops

Another option that can be useful in some cases is the possibility to only allow that the height of all images will be the height of the smallest image, avoiding that any picture gets pixelated/enlarged. (The default options will allow the enlargement of smaller images if there is a significantly higher number of larger images in the set.)

View Demo  Source Website & download