Entries from January 2009 ↓

As expected, it didn’t take long for the QuickPwn team to jailbreak the iPhone 2.2.1 firmware. QuickPwn is available now for the iPhone and the iPod Touch. [QuickPwn via Lifehacker]

Brasileirismos, or Brazil-isms, is admittedly a redundant theme for the already distinctly Brazilian collections at the Winter 2009 edition of São Paulo Fashion Week, which ended last Friday. The biggest change, compared to past seasons, was the massive influx of international journalists flown in (including our own Ami Kealoha and Greg Mitnick; video forthcoming) to provide coverage of an event whose organizers are pushing for it to stay on the fashion map.

2nd Floor was strong all around (above). Taking inspiration from the 40’s and 50’s era of aviation, the result as a romantic collection of skirts with plane appliques, bomber jackets and schoolboy looks.

Do Estilista bounced back to form after last season’s fantasy-fueled outfits. This year designer Marcelo Sommer used prints taken off tiles and dishrags from Holland (above).

The Cavalera show took on a mysticism and folklorism inspired by an annual festival that takes place on the Brazilian Amazonian island of Paratins. Animal prints appeared among colorful, saturated pieces (below left).

Oestudio came through again with their expected element of surprise, integrating social commentary into fashion. This year they seemed to criticize society’s tendency to turn a blind eye to serious issues (above right).

Always intriguing and fascinating, Osklen’s collection used cotton sweatsuit material to create rather conceptual pieces. Playing with volume and unexpected pinnings created interesting silhouettes. Proving that function need not come at the cost of appeal, I especially enjoyed their rubber items (above).

Also on Cool Hunting SPFW Summer 2009 and SPFW Winter 2008.

Many have heard about KillerStartups.com, a place where startup companies are reviewed and listed.

According to Compete.com (which measures only US traffic) they had almost 600,000 unique visitors last month. If you double that you kinda have an idea of how much traffic receives overall.  Alexa ranks the website on 8,599 position in the world (2,784 in USA). Not to mention there are over 13,000 RSS subscribers.

So, it’s a pretty well established website.

Now, the question is: How to get listed there? And fast?

Ernst (the former, now, editor-in-chief of TheNextWeb) was excited about the avalache of the new Swedish startups which made it to the web recently and wondered when KillerStartups will pick them up and review them on its website.

Well, Ernst, here’s how you can do it :) (you can also let those new startups know how they can do it by showing them this post).

I am showing my experience here. Others may have different experience (better or worst).

Yes, they have a form which you can fill in and submit. Chances are that they won’t react immediately or at all to that (that was my case).

So, I looked from where they get their news or tips, their source of information.
If you look in the image below you will see the “Source” of the news. Among other sources there is Techcrunch, Readwriteweb, Mashable, Webware. I’m not focusing on these because it’s quite hard to attract their attention (I’m sure they are pounded with many daily requests so they won’t publish them all). I’m talking about the other sources, less obvious.

In my case it was Launchfeed.com (although I don’t have a startup but a blog).
I listed my blog there and voila! In 2 days (if I remember well) Killerstartups picked it up.

But there are other sources there where you can get your startup listed quite easily and thus getting KillerStartups attention right away.

Those sources are presented below.

1) Launchfeed (www.launchfeed.com)
Go to “Submit,” then fill out the form in order to announce your launch. You need to have an English-language site, otherwise they won’t approve your submission.  I used Launchfeed to announce my site (although my site is older than 1 month) and Killerstartups.com picked it up in the next two days.

2) SimpleSpark (www.simplespark.com)
Simple Spark is the place to find and share a new world of web applications. Your website/service/application can be listed here, too. Click on “Add Apps to Spark,” then open an account.

3) Listio (www.listio.com)
Listio is a user-driven directory that allows you to submit any web 2.0 application for others to discover, rank and comment on. When you submit a new application, it will be placed in a “pending” area until an editor reviews and publishes it. Looks like a Digg for web applications. Click on “Submit a web 2.0 app link” to create an account.

4) Go2web20 (www.go2web20.net)
This is a Flash directory of Web 2.0 applications. You can send them an email by clicking on “Suggest.”

5) Lo-Fi librarian (www.lo-fi-librarian.co.uk)
This is a blog created by a Master Degree student in Library and Information Studies from UK. You can contact him/her by email and try to have your website listed on his/her site.

6) FeedMyApp (www.feedmyapp.com)
This is another web applications listing site but without a voting system. Click on “Suggest a Site” link and fill out the form (no account needs to be created).

7) Emily Chang eHub (www.emilychang.com/go/ehub)
eHub is a personal initiative of Emily Chang (a well know web designer) where she lists web startups. You can submit a site, service, or news on her “Submit a Site” page.

8) MOMB (http://momb.socio-kybernetics.net)
The MoMB (Museum of Modern Betas) is a site dedicated to listing web-based applications on a beta trip. This site is in an alpha version, but you can contact them by email (see About).

9) SociableBlog (www.sociableblog.com)
SociableBlog is a social networking and social media blog which offers the latest news, articles, and video on social networking, social media, social community, and social software worldwide. You can let them know about your service/website by clicking on the “Submit News” link (but you have to register first to use this form).

10) DemoGirl (www.demogirl.com)
Molly McDonald is the editor-in-chief of this blog (which belongs to VPOP Technologies INC www.vpop.net ). If she thinks your service is good enough, she will build a screencast of it and feature it free of charge on her DemoGirl website. You can drop her a note (see “About DG”).

11) Rev2 (www.rev2.org)
Rev2.org is a weblog dedicated to profiling new Web 2.0 startups and technologies, as well as providing in-depth analysis on the state of this industry. Send an email with your announcement to one of the editors (see the About page).

12) WebDev 2.0 (www.webdevtwopointzero.com)
They present a variety of sites which they think are useful for their readers. Go to “Submit a site” to submit your site to them for review.

13) Dzine blog (www.dzineblog.com)
Dzine blog is all about designs. Here you will find inspirational designs and some good tips in logo, graphics and web designing. Contact the owner (Contact page) and tell him about your website (especially if you have a great looking website).

14) Ziipa (www.ziipa.com)
Ziipa is a visual search engine which accepts website submissions. Just go to “Suggest” and fill out the form. They will review your submission and approve/reject it.

Note: I have chosen only those that accept English-language sites, but there are many others (Spanish, German).

After being listed in KillerStartups I had a spike in number of visitors during 2-3 days. Another advantage is that your URL may get bookmarked on social media websites like Delicious and others like that which can also drive traffic to your website.

Let us know if you have the same success getting listed on KillerStartups!

And if you want startups to know about this then bookmark and share this article.

by Noura Yehia

JavaScipt libraries have made huge leaps and bounds in helping developers write code and develop products more quickly. jQuery is one of the most popular JavaScript frameworks, with powerful tools that improve the user’s interaction with Web applications. jQuery has an additional advantage in that it allows developers to select elements on a page using CSS-like syntax.

To help you take it up a notch, we share below some methods that can help you give visitors to your website an amazing user experience. Here are over 45 impressive jQuery plug-ins and techniques that have been recently created and that could make the development of your next website an easier and more interesting experience than the last.

You may want to take a look at the following related posts:

• jQuery and JavaScript Coding: Examples and Best Practices
• 75 (Really) Useful JavaScript Techniques
• 80+ AJAX-Solutions For Professional Coding
• 60 More AJAX- and Javascript Solutions For Professional Coding

Dynamic Content

1. Build A Login Form With jQuery
In this tutorial, we’ll create a sliding panel, that slides in to reveal more content, using JQuery to animate the height of the panel. In this case, we will be creating a hypothetical login for the new tutsplus area that’s coming soon.

2. Spoiler Revealer with jQuery
A simple technique that hides some content first and fades it in once a link is clicked.

3. AJAX Upload
This AJAX file upload plug-in allows users to easily upload multiple files without having to refresh the page. In addition, you can use any element to trigger the file selection window. The plug-in creates a semi-transparent file input screen over the button you specify, so when a user clicks on the button, the normal file selection window is shown. After the user selects a file, the plug-in submits the form that contains the file input to an iFrame. So it isn’t true AJAX but provides the same user experience.

4. FCBKcomplete
Give your users fancy Facebook-like dynamic inputs, with auto-complete and pre-added values.

5. Create Accessible Charts Using Canvas and jQuery
This tool is proof that you can use the <canvas> element to illustrate HTML table data. The idea is a good one: putting the data in a table allows it to remain accessible, while the chart can be shown for visual enhancement.

Form Manipulation

6. Radio Button and Check Box Replacement
This jQuery tool replaces radio buttons and check boxes with a more appealing display.

7. Submit a Form without a Page Refresh

8. jQuery AJAX Contact Form
Here is a quick and easy way to make a jQuery AJAX contact form with a “honeypot” to foil email bots, load success and error messages dynamically without leaving the page and provide descriptive error messages detailing why submitted values have failed validation.

9. Simple jQuery Form Validation
This jQuery form shows live form-input validators both server-side and browser-side.

Navigation Menus

10. jQuery Context Menu
A context menu plug-in for jQuery that features easy implementation, keyboard shortcuts, CSS styling and control methods.

11. Kwicks for jQuery
Kwicks for jQuery started off as a port of the incredibly attractive MooTools framework, but has evolved into a highly customizable and versatile widget.

12. jQuery iPod-style Drilldown Menu
“We created an iPod-style drilldown menu to help users traverse hierarchical data quickly and with control. It’s especially helpful when organizing large data structures that don’t translate well into traditional dropdown or fly-out menus.”

13. jQuery File Tree
The jQuery File Tree is a configurable AJAX file-browser plug-in for jQuery. You can create a customized, fully-interactive file tree with as little as one line of JavaScript code.

14. How to Create a MooTools Home Page-Inspired Navigation Effect
In this tutorial, you’ll recreate the same effect seen in MooTools’s menu, but in jQuery!

15. CSS Sprites2
This tutorial demonstrates how to implement inline CSS Sprites2 using jQuery.

Manipulating Content

16. jQuery books widget
With some custom JavaScript and jQuery magic you can create some interesting widgets. A good way to demonstrate this functionality is by building a browsable Amazon.com books widget.

17. Text Size Slider
This tutorial explains how to use a slider to control the text size of an article on a page. This lets the user control exactly the size that suits them, and is also a pretty impressive feature to have on a site.

18. Pagination
Create navigational elements: when you have a large number of items, you can group them into pages and present navigational elements that allow users to move from one page to another.

19. Coda-Slider
As with the last tool, groups items together using navigational elements that allow users to move from one page to another.

20. Creating a Slick Auto-Playing Featured-Content Slider
If you love the Coda-Slider plug-in for jQuery, then you will find this plug-in very useful for displaying lots of content in a small area. This nice plug-in adds some features not found in the original Coda-Slider, such as slowly cycling through panels, auto-playing different types of custom content. An arrow indicator serves as a visual indication of which panel you are currently viewing.

• Demo can be found here.
• Download files here.

21. haccordion
A simple horizontal accordion plug-in for jQuery.

Tabular Data and Grids

22. Table Row Checkbox Toggle
This tool generically adds a toggle function to any table row you specify based on a CSS class name. It will, by default, toggle on any check boxes within that table row.

23. Tablesorter
Tablesorter is a jQuery plug-in that turns a standard HTML table with <th> and <td> tags into a sortable table without the need for page refreshes. Tablesorter can successfully parse and sort many types of data, including linked data, in a cell.

24. TableEditor
TableEditor provides flexible in-place editing of HTML tables. User-defined handler functions can easily be dropped in to update, for example, a data source via an AJAX request.

25. Scrollable HTML Table
This JavaScript code can be used to convert ordinary HTML tables into scrollable ones.

Lightbox Techniques

26. Revealing Photo Slider
Learn how to create a thumbnail photo gallery, where clicking a button reveals the entire photo and more information about that photo.

27. FancyBox
FancyBox was born to automatically scale large images to fit in windows, adding a nice drop-shadow under the zoomed item. It can be used to group related items and add navigation between them (using a pre-loading function). FancyBox is totally customizable through settings and CSS.

28. Facebox Image and Content Viewer
Facebox is a lightweight Facebook-style Lightbox that can display images, divs, and even entirely remote pages (via AJAX) inline on a page and on demand. It uses the compact jQuery library as its engine, unlike Lightbox v2.0, which uses Prototype.

29. jQuery.popeye
jQuery.popeye is a plug-in that transforms an unordered list of images into a simple image gallery. When an image is clicked, it enlarges Lightbox-style. The images are displayed in a box with “Previous” and “Next” controls, and information about the images can be included.

Image Galleries and Viewers

30. Simple Controls Gallery
Simple Controls Gallery rotates and displays each image by fading it into view over the previous one, with navigation controls that pop up when the mouse hovers over the gallery. The controls allow the user to play, pause or jump to a specific image in the gallery.

31. Agile Carousel
This jQuery plug-in allows you to easily create a custom carousel. Use the jQuery UI to enable many different types of transition. The plug-in uses PHP to call images from the folder you specify. Configure many different options including controls, slide timer length, easing type, transition type and more!

Browser Tweaks

32. Setting Equal Heights with jQuery
A script to equalize the heights of boxes within the same container and create a tidy grid.

33. jQuery IE6 PNG Transparency Fix
Another IE6 PNG fix that uses jQuery selectors to automatically fix all PNG images on a page.

34. BGI frame
This tool helps ease the pain of dealing with IE z-index issues. You can find a demo here.

35. Fix Overflow
IE puts scroll bars inside overflowing elements, and if an element is only one line, the scroll bar will cover it. This plug-in fixes that issue.

36. Lazy Load
Lazy Load delays the loading of images below the fold on long pages. As the user scrolls down, the images are loaded as needed. Check out the demo here.

37. Maxlength
It’s a fairly common design practice to limit the number of characters a user can input in a field while giving feedback on how many spaces are left. This plug-in automates that task.

Animation Effects

38. Scrollable
Scrollable is a flexible and lightweight (3.9 KB) jQuery plug-in for creating scrollable content. Scrollable items can contain any HTML, such as text, images, forms, video or any combination of them. You can make items scroll horizontally or vertically and decide how many items are visible at once.

39. jQuery Fading Menu – Replacing Content
“Instead of thinking about CSS as page layout and a way to style your page when it loads, you can use in animation and change it on-the-fly to react to events that happen on your page. Take for example a menu. You can take the “click” event that happens when clicking on a menu to do lots of stuff.”

40. Build an Animated Cartoon Robot with jQuery
This effect simulates a faux 3-D animated background reminiscent of old-school side-scrolling video games (and not unlike the parallax effect). This effect is created by layering several empty divs over each other, with transparent PNGs as background images. The backgrounds are animated at different speeds using jQuery.

41. Flip
Flip is a plug-in for jQuery that “flips” page elements in four directions. Compatible with Firefox 2+, Internet Explorer 6+, Safari 3.1 (for Windows) and Google Chrome.

• Download files here.

42. Use jQuery for Background Image Animations
Animate your menu whenever a user hovers over an item with this effect.

Image Manipulation

43. Jcrop
Jcrop is the quick and easy way to add image-cropping functionality to your Web application. It combines the ease of use of a typical jQuery plug-in with a powerful cross-platform DHTML cropping engine that is faithful to familiar desktop graphics applications.

44. jQZoom
JQZoom is a JavaScript image magnifier that makes it really easy to magnify what you want. It is easy to customize and works on all modern browsers.

Miscellaneous

45. Date Range Picker
A rich date-range widget that uses the jQuery UI’s date picker and some additional custom interaction.

46. Sortable Lists
Unordered lists are commonly used to structure a website’s navigation. Having the ability to re-order such lists would be extremely useful. Here is a method to easily save and reload the list element order without getting lost as the page is refreshed.

47. Amazing Music Player Using Mouse Gestures and Hotkeys
Learn how to create an amazing music player, coded in XHTML and jQuery, that makes use of mouse gestures and hotkeys. You can click and drag the mouse to interact with the music player’s interface or use directional keys and the space bar instead of the mouse.

48. Script for Tracking Outbound Links in Google Analytics with jQuery
This code snippet uses Google Analytics and jQuery to automatically track outbound links. This interesting script enhances behavior by comparing the link’s domain to the current page’s domain and, if they are different, triggering the behavior. This is helpful when using a CMS or other tool that generates full URLs, including the “http://,” instead of relative ones.

<script type="text/javascript">
	$('#content a:not(.popupwindow)').filter(function() {
		var theHref = this;
		if (theHref.hostname && theHref.hostname !== location.hostname) {
			$(theHref).not(".noAutoIcon").addClass("offSite");
			$(theHref).not(".noAutoLink").attr('target','_blank').bind('click keypress', function(event) {
				var code=event.charCode || event.keyCode;
				if (!code || (code && code == 13)) {
					if(pageTracker){
						var fixedLink = this.href;
						fixedLink = fixedLink.replace(/https?:\/\/(.*)/,"$1");
						fixedLink = '/outgoing/'   fixedLink;
						pageTracker._trackPageview(fixedLink);
					};
				};
			});
		};
	});
</script>

49. jGrowl
jGrowl is a jQuery plug-in that delivers unobtrusive messages within the browser, similar to the way that OS X’s Growl Framework works.

Related posts

You may want to take a look at the following related posts:

• jQuery and JavaScript Coding: Examples and Best Practices
• 75 (Really) Useful JavaScript Techniques
• 80+ AJAX-Solutions For Professional Coding
• 60 More AJAX- and Javascript Solutions For Professional Coding

About the author

Noura Yehia is a Web designer and blogger who can be found at Noupe and Devsnippets. If you want to connect with the author, you can follow her on Twitter.

Bonnie sez, “Everyone has at least one friend who has seen parts of the Star Wars original trilogy but can’t quite tell you every plot point in order. Joe Nicolosi recorded his friend Amanda as she retells the story from the tiny amount she’s seen with hilarious results.”

Star Wars: Retold (by someone who hasn’t seen it)

(Thanks, Bonnie!)

Video tutorials created from screencasting can be seen across tons of websites these days. The technique offers entrepreneurs the simplest and most effective way to show first-time users how to use their service, or demonstrate advanced techniques for die-hard fans. But where can screencasting newbies and veterans alike turn for a free and entirely web-based solution that’s easy to use and share?

Whether you’re interested in creating a screencast for business or pleasure, you’ve got a lot of options to choose from, but newcomer ScreenToaster, offers a completely free and simple software-free solution for people looking to just click and record.

ScreenToaster is a no-hassle site with little-to-no learning curve. Once you create an account, you can immediately start recording video and audio – no download required. Simply select your video (record your entire desktop or just a piece of it), audio, and camera options (you can do more than screencast), hit record and you’re off creating your masterpiece. If you opt to check the geek box you can also adjust playback speed, and in the future you’ll be able record from a VNC server or adjust the bitrate.

When you’re done recording, you can preview your video, adjust the preview image, add subtitles (cool!), upload to the site, and/or export it as an .avi file. After upload, you can share your video across social sites, grab the embed code to showcase it on your site, or just send a link to friends. ScreenToaster also lets you view and comment on other videos uploaded to the site.

We think ScreenToaster is an excellent solution that brings advanced screencasting options to all levels of computer users. Given that it works with Windows, Mac OSX, and Linux, it’s a safe option to recommend to clients, friends, and family members.

Additional Resources from Mashable

- 12 Screencasting Tools For Creating Video Tutorials

- How to Master Screencasts in Seven Steps

—
Related Articles at Mashable | All That’s New on the Web:

12 Screencasting Tools For Creating Video Tutorials
FT.com Frees Up Content
Free iPhone Apps!
Joffrey’s Introduces “Coffee 2.0” for Bloggers; Free Brew for Mashable Readers
Independent Labels Added to iTunes Plus DRM-Free Tracks
ViaTalk Free Connects Your Phone Calls At No Charge
Pandora Now Free!

Disclosure: I’m a member of the jQuery Project team

Back on January 14, 2006, a brash, young and talented developer named John Resig put out a personal project to the OSS world and hoped it could benefit *someone*. Little did he know that 3 years later, his side project would become one of the most influential frameworks for developing JavaScript-based applications. Today, the jQuery project turns 3 years old which, considering the churn rate for open source projects, is a monumental achievement. So it makes sense that on the project’s 3rd birthday, the team has announced the release of jQuery v1.3, the latest and greatest release of jQuery which includes the new Sizzle selector engine.

Along with the inclusion of Sizzle, jQuery v1.3 includes a bevvy of new features:

• Live Events: Event delegation with a jQuery twist
• jQuery Event Overhaul: Completely rewired to simplify event handling.
• HTML Injection Rewrite: Lightning-fast HTML appending.
• Offset Rewrite: Super-quick position calculation.
• No More Browser Sniffing: Using feature detection to help jQuery last for many more years to come.

The details of the release can be found via the release notes.

In addition to that, Remy Sharp donated a new dynamic API browser to the jQuery project which makes searching the jQuery API extremely easy:

The API browser includes:

• All the latest jQuery and jQuery UI documentation.
• The ability to mark pages as favorites for those pages you keep wanting to return to.
• Syntax highlighting in the code examples
• Live running of examples within the browser
• Links to edit and experiment with the code examples

In addition, Tane Piper & Remy worked together to provide an AIR app version of the browser so you can view the API locally.

The biggest update though is that the jQuery projects (i.e. jQuery & jQuery UI) will be part of the Software Freedom Conservancy thus making the projects true non-profit endeavor and providing a number of benefits to both the project and the jQuery community including:

1. It allows the current project members to continue to manage the projects and maintain ultimate responsibility for the direction of current and future efforts.
2. It allows the projects to be considered a true non-profit efforts allowing us to be able to accept donations and contributions without incurring tremendous personal financial liability.
3. The copyright of the code will be assigned to the conservancy thus ensuring that no single person will own contributions or assets of the project.
4. It may allow corporations to write off time when an employee contributes to a project.
5. Most importantly, it ensures that the jQuery projects will always be open and free software

With so many new individuals & corporations contributing to the project, doing this became a big priority to protect the investments made by the jQuery community.

This is a lot of great news for jQuery developers and here’s wishing jQuery a happy 3rd birthday.

Long time innovator Marc Canter has made a proposal for a system to let users integrate all their social networks from around the web into one central dashboard. He calls it the DiSO Dashboard.

So far it’s just a vision, albeit a pretty specific one, but we expect to see something like this on the market very soon. Is it what you want? Now is a good time to share your thoughts on the subject.

Sponsor

“Distributed Social Networking” (DiSO) is what a growing number of people are calling the move to aggregate and integrate our activities, data and social connections built up on sites like Facebook, LinkedIn, Flickr, Twitter and our personal blogs. (See also the DiSO Project.) Much of the conversation concerns technical standards to make it possible, but once it’s technically doable – how should it look for users? Canter offers the following proposal and we think it’s a good one.

Marc Canter believes that the “dashboard” is the best metaphor to manage all this activity through. Millions of people are already familiar with this basic idea, having used My.Yahoo, iGoogle, Netvibes, Pageflakes, Jive Software or other services like this. (We like dashboards here at ReadWriteWeb a lot and recommend checking out this post on traits of a successful dashboard for tips on setting one up for yourself.)

Your DiSO dashboard might serve as a new interface for your blog, your social networking account, or be a stand alone service itself. The parts of your dashboard that you made public would be discoverable and viewable by other people. What would it bring together for you to access all in one place? This is the meat of Canter’s proposal. (Update: Actually, Canter stopped by in comments below to clarify that it’s the outline structure of these data collected in a dashboard that’s really the meat of his proposal. He says he’s working on an editor to edit such outlines, in fact. See his comment below for clarification.)

• Your status and availability, see and change these from your dashboard.
• Widgets and gadgets for doing various things, just like people add to dashboards now.
• Your incoming subscriptions (RSS, friends’ new media published, perhaps some email).
• Your published media and content going out, manageable in the dashboard. Not just blog posts, microblogging messages and media – this could include your comments from around the web, reviews you’ve posted of products, testimonials people have written about you, music playlists – you name it.
• Access controls to all your content, determine what’s public, what’s private, what’s viewable by friends, family, co-workers or members of another group. This is a very important part of the distributed social networking vision.
• Your various accounts and identification. Think of this as a virtual wallet, though Canter makes no mention of commercial activities we can assume that payment methods like your PayPal balance or online banking updates would ideally be included in your private dashboard.
• Your “social graph” aggregated. See all your contact lists in one place, including links to the dashboards and various social networking accounts that each contact has given you permission to view. Ask from your dashboard for permission to connect with those contacts in new places.

The idea is that the DiSO Dashboard would be a place to read, write, manage, make discoverable, connect and normalize the data for all your activities around the web. The data standards aren’t figured out yet, but major social networking vendors are meeting now to work them out.

How would it look? What would be surfaced to users at various levels of the interface? We hope that vendors make that highly customizable but default settings are something that needs to be figured out.

What do you think? Would you like a dashboard like this? What else would you like in it? Speak up now, these services could be a big part of your experience on the web soon and they are being planned and built as we speak.

Discuss

Matt Everson built a simple little micro app for project estimation: Web Development Project Estimator:

Although most web designers have an idea of how long a project will take based on their past experience, far too often this guess becomes a final estimate. If you’ve ever been 300+ hours into a project that’s paying you for 100, I’m sure you know first hand why this can be a serious problem for a business. Up until now, I’ve used an excel spreadsheet to help me estimate accurately. About a month ago though, it occurred to me that I could make this calculator into a sweet little online tool. I figured it can only lead to more accurate estimates, stronger web businesses, and a better valuation of what we do as designers.

Of course, the fun is tracking how close you come to the estimator :)

Noupe has another nice roundup, this time they are showing 10 Smart JavaScript Techniques For Manipulating Content.

They share nice content views with demos and how to content. Included in the list is:

1. jQuery pageSlide: jQuery pageSlide is a plugin for jQuery that slides the viewable webpage off-screen, revealing and populating a secondary interaction pane. It may be used in a similar manner to Lightbox, where screen real estate and centralization of the user experience are a concern.
2. Create a simple ul list with a nice slide-out effect for li elements: We want to obtain this effect: when an user clicks on a link (”Hide”), the related
3. element disappear with a nice animated slide out effect. A simple way to implement an animated “disappear” effect using MooTools slideOut()
4. Portfolio Layout Idea Using jQuery: Benjamin Sterling created an interesting portfolio layout and added a nice easing method to the main content panel using easeOutQuad and easeInQuad using jQuery easing plugin.
5. Creating a Slick Auto-Playing Featured Content Slider: Niall Doherty’s Coda Slider inspired lot of designers and got them started quickly designing around it. Chris Coyier created a Slick Auto-Playing Featured Content Slider using Coda Slider plugin pretty much “out of the box” and added to it.
6. Easy Image or Content Slider: Easy Slider enables images or any content to slide horizontally or vertically on click. It is configurable with css alone.
7. mooSlide: mooSlide is nice replacement of the common “lightbox” module. It has some interesting options to influence the look and behaviour of the sliding box.
8. jQuery.SerialScroll: jQuery.SerialScroll allows you to easily animate any series of elements, by sequentially scrolling them.
9. Agile Carousel: Agile Carousel allows you to easily create a custom carousel.
10. Animated JavaScript Slideshow: This extremely lightweight JavaScript animated slideshow script includes a number of cool features to to style your content: description support, link support, no naming restrictions, portrait image support, graceful degradation and active thumbnail status.
11. Sexy Lightbox 2: Sexy Lightbox 2 is a sexier and lighter clone of the classic Lightbox. Supports displaying images and HTML elements.
12. UI.Layout: Was was inspired by the extJS border-layout. The UI.Layout plug-in can create any UI look you want – from simple headers or sidebars, to a complex application with toolbars, menus, help-panels, status bars, sub-forms, etc.