cssvault - inspiring creativity

iBegin has just released iBox, a “lightweight, fast, and flexible” lightbox script.

It supports the following content types:

Images
It supports image overlaying and will automatically scale down the window if the browser’s viewpane is too small.

Documents
Displays linked documents in a similar fashion as Images.

Inline Containers
iBox can also display containers (e.g. hidden DIVs) within the same page.

YouTube Videos (Flash Video)
iBox’s architecture supports plugins. Images, Documents, and Inline Containers are all plugins, and YouTube Videos is provided as an example for developers to make their own plugins.

One notable aspect of iBox is its support for non-JavaScript capable browsers. It supports a target attribute which specifies the target document to be loaded, so that you can specify a different value for the HREF attribute. Very nifty.

Links:

• iBox Homepage
• iBox Support Forum
• iBegin Labs

While surfing around today day I landed on FitFlash, a JavaScript solution to resize Flash animations “… to 100% width and 100% height when your browser window is greater than the minimum desired size and resizes flash to the minimum desired size when the browser window is smaller…”

FitFlash is a smart script that resizes your flash automatically if your browser window size is smaller or greater than your flash minimum desired size keeping it accessible independent of screen resolution.

It works seamlessly with SWFObject, which is great.

Shadowbox is a lightbox-style multimedia viewer inspired by LightWindow. This includes images, Flash videos, Quicktime, Windows Media Player, and even webpages.

From the website:

Shadowbox is a cross-browser, cross-platform, cleanly-coded and fully-documented media viewer application written entirely in JavaScript. Using Shadowbox, website authors can display pictures and movies in all major browsers without navigating away from the linking page.

Aside from support for Firefox 1.5+, Safari 2+ and IE 6+, it comes with adapters for most widely adapted JavaScript frameworks, allowing for easy integration and optimized code execution.

• Yahoo! User Interface Library
• Ext (standalone)
• Prototype + Scriptaculous
• jQuery
• MooTools (requires Fx.Styles and its dependancies)
• Dojo Toolkit (thanks Peter Higgins)

swIR uses JavaScript and Flash to dynamically apply visual effects to images on a web page, using a method similar to sIFR (Scalable Inman Flash Replacement). Probably the most interesting feature of this is the ability to scale an image long with the text. It reportedly crashes Opera, though.

It is also incompatible with other JS libraries like Prototype or MooTools and doesn’t work with hot-linked images (because of security restrictions in Flash), and you can sometimes get a FOUC (flash of unstyled content) when the image loads before JavaScript replaces it.

Given that CSS 3 can already do almost all of these effects, I am eager to explore other possibilities with Flash-based image replacement. While I expect the adoption of CSS 3 enabled browsers to come slowly, I hope the maintainers of this project will not loose interest and keep it alive with fresh ideas that cannot be done with CSS or CSS 3. How about dynamic image composition, or creating interesting button effects with the images?

From the developers of SWFObject comes SWFFix, which promises to address the issues raised by the Flash Embedding Cage Match as well two ways to embed Flash content:

1. Embed Flash content using standards compliant markup, and use SWFFix to resolve the issues that markup alone cannot solve
2. Use SWFFix to dynamically embed Flash content (similar like SWFObject and UFO)

The advantage of the first method over the second is that the actual authoring of standards compliant markup is promoted and that the mechanism of inserting Flash content doesn’t rely on JavaScript anymore, so it degrades properly:

• If you have the Flash plug-in installed, but have JavaScript disabled or a use a browser that doesn’t support JavaScript, you will still be able to see your Flash content
• Flash will now also run on a device like Sony PSP, which has very poor JavaScript support
• Automated tools like RSS readers are able to pick up Flash content

The advantage of the second method over the first is that it is easier to author, because it is less verbose and it contains no redundant code.