<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Cool Javascripts &#187; Prototype</title>
	<atom:link href="http://cool-javascripts.com/category/prototype/feed" rel="self" type="application/rss+xml" />
	<link>http://cool-javascripts.com</link>
	<description>The best javascripts for your site</description>
	<lastBuildDate>Tue, 22 Mar 2011 14:35:13 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1</generator>
<xhtml:meta xmlns:xhtml="http://www.w3.org/1999/xhtml" name="robots" content="noindex" />
		<item>
		<title>Most useful prototype / script.aculo.us plugins</title>
		<link>http://cool-javascripts.com/prototype/most-useful-prototype-plugins.html</link>
		<comments>http://cool-javascripts.com/prototype/most-useful-prototype-plugins.html#comments</comments>
		<pubDate>Tue, 05 May 2009 07:44:03 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Prototype]]></category>
		<category><![CDATA[gallery]]></category>
		<category><![CDATA[inplace editor]]></category>
		<category><![CDATA[modal window]]></category>
		<category><![CDATA[prototype plugin]]></category>

		<guid isPermaLink="false">http://cool-javascripts.com/?p=218</guid>
		<description><![CDATA[Prototype is one of the earliest new generation javascript libraries (or javascript frame work) like jQuery &#038; Mootools. Coupled with Script Aculous, it is a powerful library and many extensions/plugins are available for it. The one downside to this library is, it is rather huge and requires script aculous even for basic animations. Size is [...]


Related posts:<ol><li><a href='http://cool-javascripts.com/modal-windows/highslide-the-best-image-gallery-script.html' rel='bookmark' title='Permanent Link: Highslide &#8211; The best image gallery script?'>Highslide &#8211; The best image gallery script?</a> <small> Highslide is a standalone javascript library created mainly for...</small></li><li><a href='http://cool-javascripts.com/galleries/10-jquery-plugins-for-showing-image-gallery.html' rel='bookmark' title='Permanent Link: 10 jQuery plugins for showing image gallery'>10 jQuery plugins for showing image gallery</a> <small>An image gallery is part of the modern web 2.0...</small></li><li><a href='http://cool-javascripts.com/effects/10-jquery-plugins-for-manipulating-images.html' rel='bookmark' title='Permanent Link: 10 jQuery plugins for manipulating images'>10 jQuery plugins for manipulating images</a> <small>This time, I want to list some jQuery plugins that...</small></li></ol>

Related posts brought to you by <a href='http://mitcho.com/code/yarpp/'>Yet Another Related Posts Plugin</a>.]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.prototypejs.org/" target="_blank">Prototype</a> is one of the earliest new generation javascript libraries (or javascript frame work) like jQuery &#038; Mootools. Coupled with <a href="http://script.aculo.us/" target="_blank">Script Aculous</a>, it is a powerful library and many extensions/plugins are available for it. The one downside to this library is, it is rather huge and requires script aculous even for basic animations. Size is okay when compressed, but it is not easy to find a compressed version and if compress via javascript compressors, it might produce some errors.</p>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/prototype.jpg" alt="Prototype plugins" /></p>
<p>Here is a collection of the most useful prototype plugins grouped in to categories so that you can find your script based on your needs. Includes scripts for image galleries, lightbox, in place editors, form validation, modal windows, image manipulation, auto complete, table sorting etc.</p>
<h2>Useful resources</h2>
<ul>
<li><a href="http://www.prototypejs.org/learn" target="_blank">Prototype tutorials</a></li>
<li><a href="http://wiki.github.com/madrobby/scriptaculous" target="_blank">Script Aculous tutorials</a></li>
<li><a href="http://groups.google.com/group/prototype-core/files" target="_blank">Prototype compressed versions</a></li>
<li><a href="http://www.stevekallestad.com/blog/prototype_and_scriptaculous_compressed.html" target="_blank">Prototype &amp; Script Aculous(script.aculo.us) compressed</a></li>
</ul>
<p><span id="more-218"></span></p>
<h2>Prototype image gallery &#038; lightbox</h2>
<h3><a href="http://www.deensoft.com/lab/protoflow/" target="_blank">ProtoFlow</a></h3>
<p>ProtoFlow is the prototype equivalent of Apple&#8217;s coverflow effect. Nicely implemented with reflection (reflection.js script required).<br />
<a href="http://www.deensoft.com/lab/protoflow/" target="_blank" title="Protoflow"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/protoflowdemo.jpg" alt="Protoflow" /></a></p>
<h3><a href="http://www.nickstakenburg.com/projects/lightview/" target="_blank">LightView</a></h3>
<p>It is an excellent script which can show images, movies, flash or iframe content in an overlay effect. It supports slideshow mode for images and auto detection of media using file name extension.</p>
<p><a href="http://www.nickstakenburg.com/projects/lightview/" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/lightview.jpg" /></a></p>
<h3><a href="http://qgallery.quadrifolia.de/" target="_blank">qGallery</a></h3>
<p>This is not yet complete and is not available for download. But the demos are worth watching and looks promising. It is aimed to be a complete gallery script with support for XML based galleries width different viewing options, thumbnail zoom etc.<br />
<img src="http://cool-javascripts.com/wp-content/uploads/2009/05/qgallery-beta-089-sebastian-brink-quadrifoliade.jpg" /><br />
<img src="http://cool-javascripts.com/wp-content/uploads/2009/05/qgallery-beta-089-sebastian-brink-quadrifoliade-1.jpg" /></p>
<h3><a href="http://www.lokeshdhakar.com/projects/lightbox2/" target="_blank">Lightbox</a></h3>
<p>It is one of the first lightbox scripts.</p>
<h2>Prototype auto complete</h2>
<p><a href="http://www.brandspankingnew.net/specials/ajax_autosuggest/ajax_autosuggest_autocomplete.html" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/autosuggest.jpg" /></a></p>
<p><a href="http://www.brandspankingnew.net/specials/ajax_autosuggest/ajax_autosuggest_autocomplete.html" target="_blank">http://www.brandspankingnew.net/specials/ajax_autosuggest/ajax_autosuggest_autocomplete.html</a><br />
<a href="http://www.brandspankingnew.net/specials/ajax_autosuggest/ajax_autosuggest_autocomplete.html" target="_blank">http://www.beauscott.com/examples/autocomplete/doc/examples.html</a></p>
<h2>Prototype UI (Slider &#038; Modal Window)</h2>
<blockquote><p>
Prototype UI is a javascript library based on Prototype (1.6) and Script.aculo.us (1.8). It&#8217;s a library of User Interface components, based on a common fundation classes, which could be easily used by various web applications.</p></blockquote>
<p>.</p>
<p><a href="http://www.prototype-ui.com/" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/prototype-ui.jpg" /></a></p>
<h2>Prototype tool tip</h2>
<h3><a href="http://www.nickstakenburg.com/projects/prototip2/" target="_blank">Prototip</a></h3>
<p>It is a good script with customizable tool tips. The site contains lot of examples of customization.<br />
<a href="http://www.nickstakenburg.com/projects/prototip2/" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/prototip-2-create-beautiful-tooltips-with-ease.jpg" /><br />
</a></p>
<h2>Prototype inline editors</h2>
<h3><a href="http://editinplace.org/" target="_blank">Edit In Place</a></h3>
<p><a href="http://editinplace.org/" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/edit-in-place-example-1.jpg" /></a></p>
<h3><a href="http://inplacericheditor.box.re/demos" target="_blank">Ajax In Place Rich Editor</a></h3>
<p>This supports tinyMCE integration with in place editor.<br />
<a href="http://inplacericheditor.box.re/demos" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/ajax-in-place-rich-editor-demos.jpg" /><br />
</a></p>
<h2>Prototype form validation</h2>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/really-simple-validation-demos-prototype-extension.jpg" /></p>
<p><a href="http://www.benjaminkeen.com/software/rsv/prototype/demo.php?page=7" target="_blank">http://www.benjaminkeen.com/software/rsv/prototype/demo.php?page=7</a><br />
<a href="http://tetlaw.id.au/upload/pages/really-easy-field-validation/" target="_blank">http://tetlaw.id.au/upload/pages/really-easy-field-validation/</a></p>
<h2>Prototype table sorting</h2>
<p><a href="http://tetlaw.id.au/upload/pages/table-sorting-with-prototype/" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/sortable-table.jpg" /></a></p>
<h2>Prototype image manipulation</h2>
<h3><a href="http://www.defusion.org.uk/demos/060519/cropper.php?demoType=ratioSixteenNine&#038;image=flower&#038;formSubmit=Load+demo" target="_blank">Prototype Cropper</a></h3>
<p><a href="http://www.defusion.org.uk/demos/060519/cropper.php?demoType=ratioSixteenNine&#038;image=flower&#038;formSubmit=Load+demo" target="_blank"><br />
<img src="http://cool-javascripts.com/wp-content/uploads/2009/05/prototype-javascript-image-cropper-ui.jpg" /></a></p>
<h3><a href="http://ajaxorized.com/phototype-image-manipulation-with-javascript" target="_blank">Phototype</a></h3>
<p>phototype is a client/server-side library, based on prototype. On the server side the library is powered by PHP(with GD library) that renders the image. With phototype, you are able to rotate, resize, flip and do some other cool effects to images.<br />
<a href="http://ajaxorized.com/phototype-image-manipulation-with-javascript" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/05/ajaxorized-phototype-image-manipulation-with-javascript-1.jpg" /></a></p>
<h2>Prototype color picker</h2>
<p><a href="http://cool-javascripts.com/jquery/color-picker-galore.html" target="_blank"><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/color-picker.jpg" /></a></p>


<p>Related posts:<ol><li><a href='http://cool-javascripts.com/modal-windows/highslide-the-best-image-gallery-script.html' rel='bookmark' title='Permanent Link: Highslide &#8211; The best image gallery script?'>Highslide &#8211; The best image gallery script?</a> <small> Highslide is a standalone javascript library created mainly for...</small></li><li><a href='http://cool-javascripts.com/galleries/10-jquery-plugins-for-showing-image-gallery.html' rel='bookmark' title='Permanent Link: 10 jQuery plugins for showing image gallery'>10 jQuery plugins for showing image gallery</a> <small>An image gallery is part of the modern web 2.0...</small></li><li><a href='http://cool-javascripts.com/effects/10-jquery-plugins-for-manipulating-images.html' rel='bookmark' title='Permanent Link: 10 jQuery plugins for manipulating images'>10 jQuery plugins for manipulating images</a> <small>This time, I want to list some jQuery plugins that...</small></li></ol></p>
<p>Related posts brought to you by <a href='http://mitcho.com/code/yarpp/'>Yet Another Related Posts Plugin</a>.</p>]]></content:encoded>
			<wfw:commentRss>http://cool-javascripts.com/prototype/most-useful-prototype-plugins.html/feed</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Color picker galore!</title>
		<link>http://cool-javascripts.com/jquery/color-picker-galore.html</link>
		<comments>http://cool-javascripts.com/jquery/color-picker-galore.html#comments</comments>
		<pubDate>Tue, 13 Jan 2009 08:42:23 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[MooTools]]></category>
		<category><![CDATA[Prototype]]></category>
		<category><![CDATA[color picker]]></category>
		<category><![CDATA[color seletor]]></category>

		<guid isPermaLink="false">http://cool-javascripts.com/?p=113</guid>
		<description><![CDATA[A color picker allows the users to preview the color and select it by clicking on it. It is useful when you want to provide some customization for the user (for eg: select a background color, letter color etc). But I think is a very useful piece of code in the admin side of a [...]


Related posts:<ol><li><a href='http://cool-javascripts.com/prototype/most-useful-prototype-plugins.html' rel='bookmark' title='Permanent Link: Most useful prototype / script.aculo.us plugins'>Most useful prototype / script.aculo.us plugins</a> <small>Prototype is one of the earliest new generation javascript libraries...</small></li><li><a href='http://cool-javascripts.com/effects/improved-lava-lamp-effect-for-jquery-and-mootools.html' rel='bookmark' title='Permanent Link: Improved lava lamp effect for jQuery and Mootools'>Improved lava lamp effect for jQuery and Mootools</a> <small>The lava lamp effect was an excellent technique to turn...</small></li><li><a href='http://cool-javascripts.com/jquery/jquery-and-mootools-plugin-to-show-tooltips.html' rel='bookmark' title='Permanent Link: jQuery and Mootools plugin to show tooltips'>jQuery and Mootools plugin to show tooltips</a> <small>The tooltip is a common graphical user interface element. It...</small></li></ol>

Related posts brought to you by <a href='http://mitcho.com/code/yarpp/'>Yet Another Related Posts Plugin</a>.]]></description>
			<content:encoded><![CDATA[<p>A color picker allows the users to preview the color and select it by clicking on it.   It is useful when you want to provide some customization for the user (for eg: select a background color, letter color etc). But I think is a very useful piece of code in the admin side of a CMS site (Select font color, theme color or anything that you can imagine). There are simple scripts which generates a simple web safe color palette to advanced ones which generates a color palette like Adobe Photoshop.</p>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/color-picker-galore.jpg" /></p>
<p>Here are some cool color picker scripts that can be used. Some of them are written using plain javascript &#8211; means you don&#8217;t need any javascript library like jQuery, Mootools. And some of them are written specifically for jQuery, Mootools or Prototype (Here the advantage is a smaller footprint. If you&#8217;re already using a javascript library like jQuery or Mootools, use the one particularly written for that library). There are more than 10 scripts to choose from. <span id="more-113"></span></p>
<h2>Plain Javascript scripts for Color picker</h2>
<p>There were lot of scripts using plain javascript. Some are larger in size and some uses a popup window interface which is not Web 2.0 standard (It will be considered as an advertisement popup and will be blocked by most of the browsers). I selected three of them which are smaller in size and has the DHTML style popup or inine popup.</p>
<p>Use any of the following if you are not using a javascript library like jQuery or Mootools. </p>
<h3>DHTML color picker from Free-color-picker.com</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/javascript-color-picker-216-websafe-colors-plus-grays.jpg" /></p>
<p>It can handle web safe colors and grays. Triggering can be customized in many ways. Files can be downloaded separately according to your needs. It also supports popup window. It is a small script &#8211; just around 8KB. But if you wan to show more colors, you can&#8217;t use it. Also, the license states that it should not be modified and the link to the site should not be altered.</p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>None</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">8KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>License states that script should not be altered. Also, the link should not be removed.</td>
</tr>
<tr>
<th>Demo</th>
<td><a class="opensame" rel="shadowbox" href="http://www.free-color-picker.com/color-picker-combo.php">Open</a> | <a class="opennew" href="http://www.free-color-picker.com/color-picker-combo.php" target="_blank">Open in new window</a></td>
</tr>
<tr>
<th>Info &amp; Download</th>
<td><a target="_blank" class="opennew" href="http://www.free-color-picker.com/">Open</a></td>
</tr>
</tbody>
</table>
<h3>jsColor</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/try-it-jscolor-javascript-color-picker.jpg" /></p>
<blockquote><p>jscolor is JavaScript component extending standard form controls of the smooth <strong>color picker</strong><em>pickerize</em> your text fields
</p></blockquote>
<p>It is a good and very easy to use script when you want to show more colors. </p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>None</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">24KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None (GPL)</td>
</tr>
<tr>
<th>Demo</th>
<td><a class="opensame" rel="shadowbox" href="http://jscolor.com/try.php">Open</a> | <a class="opennew" href="http://jscolor.com/try.php" target="_blank">Open in new window</a></td>
</tr>
<tr>
<th>Info &amp; Download</th>
<td><a target="_blank" class="opennew" href="http://jscolor.com/">Open</a></td>
</tr>
</tbody>
</table>
<h3>Color Jack</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/farbtastic-jquery-color-picker-plug-in-steven-wittens-ackonet.jpg" /></p>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/color-jack.jpg" /></p>
<p>It is the smallest of them all &#8211; just 3.5KB. Also this site has two other pickers <a href="http://www.nofunc.com/DHTML_Color_Picker_2/" target="_blank">Color Picker v2</a> and <a href="http://www.nofunc.com/DHTML_Color_Sphere/" target="_blank">Color Sphere<br />
</a>. Choose one that matches your required style. </p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>None</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">4KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None</td>
</tr>
<tr>
<th>Demo</th>
<td><a class="opensame" rel="shadowbox" href="http://www.nofunc.com/DHTML_Color_Sphere/">Color Sphere</a> | <a class="opennew" href="http://www.nofunc.com/DHTML_Color_Sphere/" target="_blank">Color Sphere</a> <br />
<a class="opensame" rel="shadowbox" href="http://www.nofunc.com/DHTML_Color_Picker/">Color Picker 1.0</a> | <a class="opennew" href="http://www.nofunc.com/DHTML_Color_Picker/" target="_blank">Color Picker 1.0</a> <br />
<a class="opensame" rel="shadowbox" href="http://www.nofunc.com/DHTML_Color_Picker_2/">Color Picker V2.0</a> | <a class="opennew" href="http://www.nofunc.com/DHTML_Color_Picker_2/" target="_blank">Color Picker 2.0</a>
</td>
</tr>
<tr>
<th>Info &amp; Download</th>
<td><a target="_blank" class="opennew" href="http://www.colorjack.com/">Open</a></td>
</tr>
</tbody>
</table>
<h3>Others</h3>
<ul>
<li><a target="_blank" class="opennew" href="http://www.nogray.com/color_picker.php">Color Piker by Nogray.com</a> It is a photoshop like color picker </li>
</ul>
<h2>Color Pickers for jQuery</h2>
<p>jQuery is a wonderful javascript library and the number of available plugins are growing rapidly. If you&#8217;re already using jQuery, choose a color picker from here.</p>
<h3>Farbtastic color picker plug-in </h3>
<p>Farbtastic: jQuery color picker plug-in</p>
<blockquote><p>
Farbtastic is a jQuery plug-in that can add one or more color picker widgets into a page through JavaScript. Each widget is then linked to an existing element (e.g. a text field) and will update the element&#8217;s value when a color is selected.<br />
Farbtastic uses layered transparent PNGs to render a saturation/luminance gradient inside of a hue circle. No Flash, no pixel sized divs.
</p></blockquote>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>jQuery</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">9KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://acko.net/dev/farbtastic">Open</a> | <a class="opennew" href="http://acko.net/dev/farbtastic" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>
<h3>Color picker by eyecon.ro</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/colorpicker-jquery-plugin.jpg" /></p>
<blockquote><p>A simple component to select color in the same way you select color in Adobe Photoshop</p></blockquote>
<ul>
<li>Easy to use and looks good</li>
<li>Powerful controls for color selection</li>
<li>Easy to customize the look by changing some images
</li>
</ul>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>jQuery</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">16KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://www.eyecon.ro/colorpicker/">Open</a> | <a class="opennew" href="http://www.eyecon.ro/colorpicker/" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>
<h3>Normal color picker by www.felecan.com</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/jquery-color-picker-normal.jpg" /></p>
<p>It is a lightweight color picker.</p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>jQuery</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">Less than 5KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://www.felecan.com/jquery-normal-color-picker/">Open</a> | <a class="opennew" href="http://www.felecan.com/jquery-normal-color-picker/" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>
<h3>jQuery color picker by Syronex</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/jquery-color-picker.jpg" /></p>
<p>It is a simple color picker which is useful when you want to show a defined set of colors and the user should select only from them (For eg: To select a theme color in web sites).</p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>jQuery</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">Less than 4KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None (GPL)</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://www.syronex.com/software/jquery-color-picker">Open</a> | <a class="opennew" href="http://www.syronex.com/software/jquery-color-picker" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>
<h3>Others</h3>
<ul>
<li><a class="opennew" href="http://wanderinghorse.net/computing/javascript/jquery/colorpicker/demo-colorpicker.html" target="_blank">Rudimentary jQuery color picker</a></li>
<li><a class="opennew" href="http://www.intelliance.fr/jquery/color_picker/" target="_blank">jQuery color picker by intelliance.com</a></li>
</ul>
<h2>Color pickers for Mootools</h2>
<h3>Moo Rainbow</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/moorainbow.jpg" /></p>
<blockquote><p>mooRainbow is a powerful Javascript color picker that allows you to visually choose and use colors as a real and useful application.</p></blockquote>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>MooTools</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">5KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None (MIT License)</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://moorainbow.woolly-sheep.net/">Open</a> | <a class="opennew" href="http://moorainbow.woolly-sheep.net/" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>
<h3>Mootools color picker by Sweetvision.com</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/color-picker-example-1-sweetvision1.jpg" /></p>
<blockquote><p>The Color Picker displays a Hue selection bar Saturation/Value selection box, Text fields for entering HSV and RGB fields. The dialog for the color picker is drag-able and there are many actions that you can attach function calls to in order to allow your application to respond to events in the Color Picker. The size of the Hue Bar and the SV Box can be set to any size using options. The elements of the Color Picker can be styled to match the design of your site.</p></blockquote>
<p>It supports two types of interface &#8211; a popup layer type and an in-place color picker</p>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/color-picker-example-2-sweetvision.jpg" /></p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>MooTools</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">12KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://www.sweetvision.com/projects/javascript-color-picker/">Open</a> | <a class="opennew" href="http://www.sweetvision.com/projects/javascript-color-picker/" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>
<h2>Color pickers for Prototype</h2>
<h3>Color picker by John Dyer</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/color-picker.jpg" /></p>
<p>It is a photoshop like color plugin built on prototype library.</p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>Prototype</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">10KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://johndyer.name/post/2007/09/PhotoShop-like-JavaScript-Color-Picker.aspx">Open</a> | <a class="opennew" href="http://johndyer.name/post/2007/09/PhotoShop-like-JavaScript-Color-Picker.aspx" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>
<h3>Prototype color picker by Myles Eftos</h3>
<p><img src="http://cool-javascripts.com/wp-content/uploads/2009/01/javascript-colour-picker-demo-by-myles-eftos.jpg" /></p>
<p>It is a simple color picker which support web safe palette.</p>
<table border="0">
<tbody>
<tr>
<th>Dependencies</th>
<td>Prototype</td>
</tr>
<tr>
<th>Size</th>
<td class="alt">5KB</td>
</tr>
<tr>
<th>Restrictions</th>
<td>None</td>
</tr>
<tr>
<th>Demo &amp; Download</th>
<td><a class="opensame" rel="shadowbox" href="http://myles.eftos.id.au/blog/2006/04/13/javascript-colour-picker-based-on-prototype/">Open</a> | <a class="opennew" href="http://myles.eftos.id.au/blog/2006/04/13/javascript-colour-picker-based-on-prototype/" target="_blank">Open in new window</a></td>
</tr>
</tbody>
</table>


<p>Related posts:<ol><li><a href='http://cool-javascripts.com/prototype/most-useful-prototype-plugins.html' rel='bookmark' title='Permanent Link: Most useful prototype / script.aculo.us plugins'>Most useful prototype / script.aculo.us plugins</a> <small>Prototype is one of the earliest new generation javascript libraries...</small></li><li><a href='http://cool-javascripts.com/effects/improved-lava-lamp-effect-for-jquery-and-mootools.html' rel='bookmark' title='Permanent Link: Improved lava lamp effect for jQuery and Mootools'>Improved lava lamp effect for jQuery and Mootools</a> <small>The lava lamp effect was an excellent technique to turn...</small></li><li><a href='http://cool-javascripts.com/jquery/jquery-and-mootools-plugin-to-show-tooltips.html' rel='bookmark' title='Permanent Link: jQuery and Mootools plugin to show tooltips'>jQuery and Mootools plugin to show tooltips</a> <small>The tooltip is a common graphical user interface element. It...</small></li></ol></p>
<p>Related posts brought to you by <a href='http://mitcho.com/code/yarpp/'>Yet Another Related Posts Plugin</a>.</p>]]></content:encoded>
			<wfw:commentRss>http://cool-javascripts.com/jquery/color-picker-galore.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

