We have seen a lot of Fisheye menus, however The Fisheye component is a bit different to others. It is built with Flex which shows us how the best of what flex gives you (productivity, development process, consistent component model) with the best of what people have been doing in flash for years (rich, highly interactive, fluid, etc).

The Fisheye component is based around the concept of itemRenderer factories, just like the flex list and charting components. The goal is to use composition to separate behaviour from content, so you can reuse the basic fisheye effect across many different applications and uses. It’s available under the MIT Open Source license, so feel free to use it or modify it in your own applications. Check out the 2D Fisheye Demo, it looks really nice.

Requirements: Flex
Demo: http://www.quietlyscheming.com/blog/components/fisheye-component
License: MIT License

• 6 Comments

We have published a post about Send Notifications Instantly with Growl Mootools few days ago. And then one of our readers, Oskar Krawczyk has pointed out that there is another Growl-like notifier called Roar which is more configurable.

Roar is a notification widget that streamlines incoming messages, such as updates or errors, without distracting the user from their browser experience or breaking their work-flow by displaying obtrusive alerts. Roar is inspired by Growl, and is realised with MooTools as well. You can check out the following 3 examples below.

• Never-ending Feed Showing feed items with link but without end.
• Random Alerts Random notifications for all 4 corners of the document.
• Update Ticker Timed updates on events.

Roar has been tested on all A-Grade Browsers and it is available under the MIT License.

Requirements: Mootools Framework
Demo: http://digitarald.de/project/roar/
License: MIT License

• 2 Comments

noobSlide is a mootools based slide show gallery. You can see 7 different styles of images galleries / slide shows. I think they are working smoothly and looking nice. However, I particular like example 6 and 7. If your web application / website is already using mootools, noobSlide is definitely a good choice to power your image gallery. noobSlide is licensed under MIT License.

Requirements: Mootools Framework
Demo: http://efectorelativo.net/laboratory/noobSlide/sample.html
License: MIT License

• 12 Comments

ddmenu is a simple MooTools-based script to create you’re own context menus. The Menu Appearance is adapted to the System Content Menu behavior. You can enable or disable any selected menu items. Users can switch between ddmenu and browser default context menu easily. Menu styling can be easily defined in external stylesheet as well. At last, It has full A-Graded browsers support which has been tested on Firefox 2, Safari 3, Internet Explorer 6/7, Opera 9 under Windows. Firefox 2, Safari 3 under Mac OS X.

Requirements: Mootools framework
Demo: http://webhike.de/scripts/dd/ddmenu.html
License: MIT License

• 1 Comment

FancyBox is similar to lightbox-like tools, but with kinda different image zooming script for those who want something fresh. It is powered by great javascript library - jQuery, tested with IE6, IE7, Firefox. It supports single or a group of images as other gallery scripts. Zooming in and out effects are customizable. CSS is seperated from js code to improve speed and customization. I really like the loading animation which is inside the thumbnail rather than in the center of the whole screen.

Requirements: jQuery
Demo: http://fancy.klade.lv/
License: MIT License

• 3 Comments

markItUp! is a JavaScript plugin built on the jQuery library. It allows you to turn any textarea into a markup editor. Html, Textile, Wiki Syntax, Markdown, BBcode or even your own Markup system can be easily implemented. markItUp! is not meant to be a “Full-Features-Out-of-the-Box”-editor. Instead it is a very lightweight, customizable and flexible engine made to meet the developer’s needs in their CMSes, blogs, forums or websites.

markItUp! is released under both the MIT and GPL Open Source licenses. In short, this means that markItUp! is totally Free, and you can do whatever you want with it. You are only obligated to keep the credits in place. Check out the examples yourself.

Requirements: jQuery 1.2 Javascript library
Demo: http://markitup.jaysalvat.com/examples/
License: MIT / GPL License

• 3 Comments

The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem. The premise of the system is ideally suited to rapid prototyping, but it would work equally well when integrated into a production environment. There are printable sketch sheets, design layouts, and a CSS file that have identical measurements.

All modern monitors support at least 1024 × 768 pixel resolution. 960 is divisible by 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 and 480. This makes it a highly flexible base number to work with. You can download a Zip file which contains PDF grid paper, templates for Fireworks, OmniGraffle, Photoshop & Visio, and CSS framework with demo HTML.

Requirements: -
Demo: http://960.gs/
License: MIT / GPL License

• 7 Comments

With new social networks launching everyday most start with the same basic features. Bloggers have WordPress, Mephisto, Typo and other open source solutions. Yet there isn’t an open source social network platform, until now. LovdByLess is an open source social network platform which is built with Ruby on Rails, this open source project has all the basic features you will need to setup a basic social network.

You can follow a user, mutual following is friending. User-to-User Messaging, User Profile, Comments, Photo Gallery with Captions, Friends Search, Flickr and YouTube Integration as well. If you are going to build a social networking web application, LovdByLess is a really good platform to start with. However, you need to install Ruby on Rails first apparent.

P.S. Thank you Evan pointed out that barnraiser.org is actually the first one of open source social software, that’s been around for a couple years now.

Requirements: Ruby on Rails
Demo: http://try.lovdbyless.com/
License: MIT License

• 13 Comments

We have seen many modal box script (e.g. Prototype Window, Multibox, Modalbox and etc). I would like to introduce something a little bit difference to you guys. Here are the following two Facebook-style modal boxes. Both of them have a sexy transparent border which looks really stylish.

1) Facebox is a jQuery-based, Facebook-style lightbox which can display images, divs, or entire remote pages. It’s simple to use and easy on the eyes. Download the tarball, view the examples, then start enjoying the curves.

2) GlassBox is a compact Javascript User Interface (UI) library, which use Prototype and Script.aculo.us for some effects. With GlassBox you can build transparent border, colorful layouts and “Flash-like” effects. The GlassBox library is easy to use, customizable and skinnable, and it comes with a coherent API and documentation.

Requirements: Any Modern Browsers, IE 6, Firefox 2, Opera 9 and Safari 3
Demo: http://famspam.com/facebox, http://www.glassbox-js.com
License: License Free, MIT License

• 8 Comments

One of the most common problems a web developer usually face is related to continuously rotate a fragment of content. It can be a presentation of headlines, small fragments of news or a list of thumbnails. The nature of the thing being rotated doesn’t matter too much here because all those kind of applications share always the same idea: Rotating. This objective can be achieve in different ways like fading and scrolling. Well here is iCarousel becomes useful. It’s a one step forward trying to generalize all those types of widgets providing a rich presentation and making the task easy to be done.

Requirements: Internet Explorer, Firefox, Opera and Safari
Demo: http://zendold.lojcomm.com.br/icarousel/
License: MIT License

• 4 Comments