
Pretty cool effect, and addition to your web design project(s) that involve photography/images…
Source: Codrops
Pretty cool effect, and addition to your web design project(s) that involve photography/images…
Source: Codrops
Interesting interview of the breakdown/process poured into making Adobe and Big Spaceship’s latest project: The Expressive Web.
Adobe Principal Product Manager Mike Chambers sits down with Stephen Koch, Sr. Developer from digital creative agency Big Spaceship, to discuss new design tools in HTML5 and CSS3 that can help you create expressive features in your webpages’ UIs.
Here’s the video.
I had a small project that asked for a URL and a pixel-image to be tracked. Another requirement was to replace a certain string in it with a timestamp of some sort.
Here’s a snippet to resize a background image to the dimensions of an element. In this case, #bkgImage.
var resizeBkg = function() {
var h = self.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
var w = self.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var e = document.getElementById('bkgImage');
if (w > h) {
e.width = w;
e.height = w;
} else {
e.height = h;
e.width = h;
}
}
Here’s a snippet of JS code that might come in handy if you, let’s say, would like to filter out what type of content to display depending on your website user’s OS. A real-life example would be having a download link show up to user’s who have a client that was only published on Windows.
// This script sets OSName variable as follows:
// "Windows" for all versions of Windows
// "MacOS" for all versions of Macintosh OS
// "Linux" for all versions of Linux
// "UNIX" for all other UNIX flavors
// "Unknown OS" indicates failure to detect the OS
var OSName="Unknown OS";
if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows";
if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS";
if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX";
if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux";
document.write('Your OS: '+OSName);
Note: An alternate way can be found via PPK’s quirksmode.org