DanSolo’s HQ

IxEdit is an easy-to-use & free tool which aims to simplify the implementation of interactions on a web page, specially for anyone who is not experienced in JavaScript.

This interaction design tool is built with JavaScript & needs to be embedded into the webpage being edited. With the help of a modal-box-like interface, interactions created will be applied instantly.

Rather than totally new scripts, IxEdit generates jQuery & jQuery UI code using the parameters specified.

Interactions are stored in a local database (Google Gears), so, anything created won’t be lost even if the page is refreshed or closed.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Dreamhost $50 Discount Code: WRD
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• Table Sorter Plugin For jQuery: tablesorter
• Smart Floating Banners
• Slideshow JS: Unobtrusive JavaScript Slideshow
• Skin Your Ajax Applications: ThemeRoller
• Rounded Corners With No Images Using curvyCorners

We posted on jQTouch, the jQuery based iUI-esque toolkit that David Kaneda created.

Today they have released a new version which improves on their extensible system with:

• Improved 3D flip transition
• Callback events throughout for page transitions, swipe events, and orientation changes
• Included demos: Clock, To-do, Main functional demo
• Theming: Currently has Apple and jQTouch theme (gray)

Read more about getting started and the callback API.

As soon as we developed Bespin we wanted a world where we could create an application in the editor and see it live... and then edit it all live too! Server-side JS makes this quite possible.

Clamato is experimenting in this way too, albeit slightly differently:

Clamato is a Smalltalk dialect that is designed to operate within the JavaScript runtime. (For non-Canadians: “clamato” is what you get when you add clams to tomato juice. Some consider this an unholy mixture; others, a tasty treat.)

You have to see it in action to appreciate it. Browse over to the tutorial to tweak the live application on the fly. Fun!

Getting ready to launch a brand new concept? Would you like to know what other professionals think before you release it to the world?

Concept Feedback is designed specifically for small and medium business marketers, graphic designers, and web developers. Concept Feedback provides a simple tool to get quality feedback on marketing concepts. You can upload and share your website, advertisement, logo and more. Best of all, it’s 100% Free!

Requirements: -
Demo: http://www.conceptfeedback.com/
License: License Free

Sponsors

Dreamhost: Get $50 Off with Coupon Code: WEBAPPERS

Wix - A Free Flash Website Builder

FontCapture is a simple & free web application with an impressive function: it turns any handwriting into a font.

It does not require any software and works in few steps:

• download (PDF) & print a special template
• fill it with your handwriting
• scan & upload the template

The service automatically creates your font & presents you the download file.

Also, just before downloading the generated fonts, you can see a full-preview & decide to re-create a new one or not.

P.S. The service is currently in beta status.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Dreamhost $50 Discount Code: WRD
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• PHP Captcha Script: Securimage

WebSVN is an open source & web-based application that offers an easy browsing experience for your subversion repositories.

You can view the log of any file or directory and see a list of all the files changed, added or deleted in any given revision.

Also, the differences between two versions of a file can be seen to exactly findout what was changed in a particular revision.

Other features of WebSVN:

• customizable templating system
• colourization of file listings
• blame view
• log message searching
• RSS feed support

A demo of the application can be viewed here.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Dreamhost $50 Discount Code: WRD
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• Zimplit: Easiest CMS For Simple Websites
• Wiki-Like Project Management Tool: Streber
• Web-Based PHP FTP Application: phpWebFtp
• Web-Based MySQL Management With Only 1 File: Adminer
• Web Server That Runs On CD-Rom: Server2Go

ChocoTemplates is sharing 15 (currently) beautiful & free website templates including rarely-found ones like GUI & portfolio templates.

They are XHTML-CSS templates which are not customized specially for any CMS or blogging software.

Some of them (portfolio templates) come with a built-in slider script & all are free to use under the CC Attribution 3.0 license.

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Dreamhost $50 Discount Code: WRD
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• No related posts.

Konigi, a must-bookmark resource for UI designers, is sharing a handy "do-it yourself wireframe magnets kit" for easy whiteboard prototyping.

They are based on the Konigi wireframe stencils and includes 3 sheets of elements (form elements, HTML editor, etc.).

How To Create Them?

Simply download and print the PDFs on to magnet sheets, optionally laminate them if you intend to use with dry-erase markers, and finally cut them out.

2 Things You May Consider Buying (from Amazon.com):

• Avery 3270 Printable Magnet Sheet for Inkjet Printer (White)
• 3M LS950 No-Heat Laminating System

Special Downloads:
Ajaxed Add-To-Basket Scenarios With jQuery And PHP
Free Admin Template For Web Applications
jQuery Dynamic Drag’n Drop
ScheduledTweets

Advertisements:
SSLmatic – Cheap SSL Certificates (from $19.99/year)
Dreamhost $50 Discount Code: WRD
Follow WebResourcesDepot At Twitter And Get More Resources!

Related posts

• User Interface Library For MooTools: MochaUI
• UI Pattern Factory: User Interface Design Best Practices & Inspiration
• Track Mouse Activities With JS And PHP: (smt)
• Sketching And Prototyping Tool: Pencil Project
• jQuery UI 1.7 Is Out With Tons Of New Features

jQuery.timepickr was created in a attempt to make the process of inputing time in a form as easy and natural as possible. It is a simple 2-click in place editing time picker and regular time picker.

It is unobtrusive and degrade gracefully. It has intuitive keyboard navigation support as well. jQuery.timepickr has just released Version 0.7 with the support of jQuery UI theme switcher. You can play around it with different themes offered.

Requirements: jQuery Framework
Demo: http://haineault.com/media/jquery/ui-timepickr/page/
License: MIT License

Sponsors

Dreamhost: Get $50 Off with Coupon Code: WEBAPPERS

Wix - A Free Flash Website Builder

Hello Ajaxians, my name is Paul Young and I am the co-founder of Skybound Software. We're the company behind Stylizer, which is a real-time CSS editing tool. We're taking a pretty radical approach to CSS editing, and as such, a lot of what I do is "web technology research", which is looking for better ways of doing things with a web browser, ultimately so that Stylizer can automate more of the web development process. This has allowed me the chance to discover a few things that have had significant impact on a web developer's workflow, as was the case with State Scope Image Replacement.

In conducting some research for a future version of Stylizer I found a way to create a querySelector method for IE 7 and lower. querySelector is a very useful feature of newer web browsers. It takes a CSS selector as string parameter and returns an array containing the HTML elements that match the selector. Unfortunately it doesn't work in IE 7 and lower... until now :)

My querySelector technique works in IE7 back to IE4 (although I only tested it back to version 6). It's only 327 characters minified, and runs ultra-fast because it doesn't parse strings or traverse the DOM. Keep in mind though that it's using the CSS selector engine built into the browser, which means no funky CSS 3 selector features will work, as they weren't implemented old versions of IE.

In order to explain how it works, I'll need to first cover something else I discovered: Single Execution CSS Expressions (SECEs). These are an enormously powerful technique that unfortunately has been made impossible in IE8. We're using these extensively in the built-in CSS reset feature in Stylizer to eradicate bugs and to add critical but missing features in IE 6 and 7.

About CSS Expressions

The problem with IE's CSS expressions feature is that because they're recalculated hundreds of times per second, they're notoriously slow. Fortunately, I've found a way to ensure they're only executed once per matched element. Examine the code below:

There are 3 things you need to know to understand how this works:

• CSS expressions are executed regardless of whether the CSS property name is valid. So "-singlex" is just an arbitrary name.
• CSS expressions are executed on every matched element. So in the case above, on every div on the page.
• Inside a CSS expression, the "this" keyword refers to the current matched HTML element.
• The code above checks to see if the matched element has a property called "singlex". If it does, it just returns 0. Otherwise, it executes an inline function, passing it a reference to the matched element. Inside that function, we can perform whatever processing we want. At the end, we set a flag on the element to ensure that the function won't be executed again.

This is how you can do complex processing inside a CSS expression without having to worry about a performance hit. The function only executes on the first execution of the expression, and then on every subsequent execution, 0 is returned instantly. The performance cost of running an if test and returning 0 is negligible, even if you're doing it thousands of times per second. If you paste that CSS into a page with 3 div elements on it, in IE it will alert "DIV" 3 times.

The things you can do with SECE's are basically limited only by your imagination. Here is an example of using one to fake the CSS content property in IE 7 and lower:

You can use SECEs to fake all sorts of things like generated content, min-width and min-height, CSS counters, CSS outlines, and more. But most importantly, you can...

Create a querySelector method with Single Execution CSS Expressions!

Creating a querySelector method is just a matter of dynamically adding a SECE to a page that copies a reference to each matched HTML element into a globally accessible array, and then returning that array. Examine the code below:

There you have it! The function is wrapped in a conditional compilation comment to make sure only IE 7 and lower can see it. Here is a minified version for convenience:

I hope you can make use of SECEs and this querySelector method. Maybe it even has a place in jQuery? I don't know. (John Resig, are you reading? :)

UPDATE

After thinking this through a little further, I realized that you don't need to use a SECE at all for this, just a CSS expression added with JavaScript will do. Also, one of the commenters (Jordan1) pointed out that the code wouldn't return elements that had already been queried once. I've posted an update to the code below that should rectify the issue:

NOTE: Fancy writing a guest post for Ajaxian? Got some tips on content that we haven't covered? Please email us, or tweet me :)