<?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>NonStopSites Blog &#187; jquery</title>
	<atom:link href="http://blog.nonstopsites.us/tag/jquery/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.nonstopsites.us</link>
	<description>Dynamic Websites Done Right!</description>
	<lastBuildDate>Sat, 24 Jul 2010 06:02:46 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>Using ColorBox JQuery Plugin</title>
		<link>http://blog.nonstopsites.us/using-colorbox-jquery-plugin/</link>
		<comments>http://blog.nonstopsites.us/using-colorbox-jquery-plugin/#comments</comments>
		<pubDate>Sun, 24 Jan 2010 04:19:13 +0000</pubDate>
		<dc:creator>Sech</dc:creator>
				<category><![CDATA[Tips]]></category>
		<category><![CDATA[Tools]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[plugins]]></category>
		<category><![CDATA[wordpress]]></category>

		<guid isPermaLink="false">http://blog.nonstopsites.us/?p=157</guid>
		<description><![CDATA[There are a number of lightbox tools are available. Until I discovered ColorBox JQuery plugin, I wasn't completely comfortable using any of them. Why ColorBox? Well, it is easy to use, lightweight and it supports all kinds of different content like photos, photo groups, slideshow, ajax, inline, and iframed content. I am using ColorBox JQuery [...]]]></description>
			<content:encoded><![CDATA[<!-- sphereit start --><p>There are a number of lightbox tools are available. Until I discovered <a href="http://colorpowered.com/colorbox/">ColorBox JQuery plugin</a>, I wasn't completely comfortable using any of them.</p>
<p>Why ColorBox? Well, it is easy to use, lightweight and it supports all kinds of different content like photos, photo groups, slideshow, ajax, inline, and iframed content.</p>
<p>I am using ColorBox JQuery plugin on one of my sites but I wish it was as easy as the <a href="http://www.longren.org/wordpress/thumbnail-viewer/">thumbnail viewer plugin</a> when using on a WordPress site. With thumbnail viewer plugin all you need to do is add rel=thumbnail to any link tag surrounding your thumbnail. You'll see an example below.</p>
<p>There are a couple of <a href="http://wordpress.org/extend/plugins/tags/colorbox">WordPress ColorBox plugins available</a>. I haven't tried the LightBox Plus yet. I haven't been able to get the JQuery ColorBox WordPress plugin to work. I'd rather use ColorBox JQuery plugin on my WordPress site without a plugin. I am still experimenting with that. Including JQuery functions on WordPress header is a little different. I will soon update you on that. Stay tuned...</p>
<p>UPDATE 03/06/2010:</p>
<p>OK! Now the image on this post works with ColorBox. Here is how I made it work:</p>
<p>Added the link to the ColorBox stylesheet on the header.php right after all the other stylesheet links.<br />
After  "wp_head();", I put the link to the ColorBox script and the JQuery function call:</p>
<blockquote><p>
$(document).ready(function($){<br />
	$("a[rel='colorbox']").colorbox();<br />
});
</p></blockquote>
<p>Now, pay attention to the $ in the function bracket. You won't see it on ColorBox example pages. This is required when you are adding JQuery functions to your WordPress header. Without that all the $ within your code would not be interpreted correctly. This is the best way to add JQuery functions to your WordPress header.</p>
<p>Finally I added the rel="colorbox" to the link to the image. You can use a different name but make sure it is the same one you in the JQuery function.</p>
<p>One last point: If you have the <a href="http://blog.nonstopsites.us/wordpress-flickr-manager-plugin/">WordPress Flickr Manager plugin</a> as I do, disable the image viewer.</p>
<p>Here is the ColorBox example:</p>
<p><a href="http://blog.nonstopsites.us/wp-content/uploads/2010/01/1257390858019.jpg" rel="colorbox"><img src="http://blog.nonstopsites.us/wp-content/uploads/2010/01/1257390858019-216x300.jpg" alt="" title="ColorBox Test" width="216" height="300" class="aligncenter size-medium wp-image-159" /></a></p>
<!-- sphereit end --><span style="margin-bottom:40px; border-bottom:none;"><a class="iconsphere" title="Sphere: Related Content" onclick="return Sphere.Widget.search('http://blog.nonstopsites.us/using-colorbox-jquery-plugin/')" href="http://www.sphere.com/search?q=sphereit:http://blog.nonstopsites.us/using-colorbox-jquery-plugin/">Sphere: Related Content</a></span><br/><br/>]]></content:encoded>
			<wfw:commentRss>http://blog.nonstopsites.us/using-colorbox-jquery-plugin/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>JQuery</title>
		<link>http://blog.nonstopsites.us/jquery/</link>
		<comments>http://blog.nonstopsites.us/jquery/#comments</comments>
		<pubDate>Thu, 10 Apr 2008 18:44:09 +0000</pubDate>
		<dc:creator>Sech</dc:creator>
				<category><![CDATA[Tools]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>

		<guid isPermaLink="false">http://blog.nonstopsites.us/?p=27</guid>
		<description><![CDATA[When I wanted to have basic AJAX functionality, I searched, downloaded, tested a variety of AJAX frameworks. In the end I started using JQuery to add AJAX and other nifty interactions to the web sites I build. jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, [...]]]></description>
			<content:encoded><![CDATA[<!-- sphereit start --><p>When I wanted to have basic AJAX functionality, I searched, downloaded, tested a variety of AJAX frameworks. In the end I started using JQuery to add AJAX and other nifty interactions to the web sites I build.</p>
<blockquote><p>jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. <strong>jQuery is designed to change the way that you write JavaScript.</strong></p></blockquote>
<p><a title="JQuery.com" href="http://jquery.com/" target="_blank">JQuery.com</a></p>
<p>Above pretty much sums up what JQuery is and what it will do for you. It is easy to understand and use but if you are in a hurry and need to get certain type of interactions available on your web site, you can find a solution by browsing through the library of plugins that are readily available. In no time you would have Ajax functionality available on your web site.</p>
<p>Here are some of my favorite JQuery Plugins:</p>
<p><a title="Tablesorter JQuery Plugin" href="http://tablesorter.com/docs/" target="_blank">Tablesorter 2.0</a><br />
<a title="MP# Player JQuery Plugin" href="http://www.sean-o.com/jquery/jmp3/" target="_blank">Sean O's MP3 Player</a><br />
<a title="Tabs JQuery Plugin" href="http://stilbuero.de/jquery/tabs_3/" target="_blank">UI Tabs</a></p>
<p>If you wanted to dig deeper and learn more about JQuery, there is a wealth of information available online including tutorials. You may also want to get the following books:</p>
<div class="amtap-item" lang="en" xml:lang="en"><a href="http://www.amazon.com/Learning-jQuery-Interaction-Development-JavaScript/dp/1847192505%3FSubscriptionId%3D1HFSGG3Z2D759XAJMPG2%26tag%3Dnonstopsiteco-20%26linkCode%3Dxm2%26camp%3D2025%26creative%3D165953%26creativeASIN%3D1847192505"><img src="http://ecx.images-amazon.com/images/I/51icudX%2BtaL._SL110_.jpg" width="89" height="110" alt=""/></a><br />
<h3><a href="http://www.amazon.com/Learning-jQuery-Interaction-Development-JavaScript/dp/1847192505%3FSubscriptionId%3D1HFSGG3Z2D759XAJMPG2%26tag%3Dnonstopsiteco-20%26linkCode%3Dxm2%26camp%3D2025%26creative%3D165953%26creativeASIN%3D1847192505">Learning jQuery</a></h3>
<p class="author">Jonathan Chaffer.					Packt Publishing 2007, 					Paperback,				380 pages,				&#36;33.85</p>
</div>
<div class="amtap-item" lang="en" xml:lang="en"><a href="http://www.amazon.com/jQuery-Action-Bear-Bibeault/dp/1933988355%3FSubscriptionId%3D1HFSGG3Z2D759XAJMPG2%26tag%3Dnonstopsiteco-20%26linkCode%3Dxm2%26camp%3D2025%26creative%3D165953%26creativeASIN%3D1933988355"><img src="http://ecx.images-amazon.com/images/I/41xoiw-VC-L._SL110_.jpg" width="88" height="110" alt=""/></a><br />
<h3><a href="http://www.amazon.com/jQuery-Action-Bear-Bibeault/dp/1933988355%3FSubscriptionId%3D1HFSGG3Z2D759XAJMPG2%26tag%3Dnonstopsiteco-20%26linkCode%3Dxm2%26camp%3D2025%26creative%3D165953%26creativeASIN%3D1933988355">jQuery in Action</a></h3>
<p class="author">John Resig (Foreword).					Manning Publications 2008, 					Paperback,				376 pages,				&#36;24.84</p>
</div>
<p>Â </p>
<!-- sphereit end --><span style="margin-bottom:40px; border-bottom:none;"><a class="iconsphere" title="Sphere: Related Content" onclick="return Sphere.Widget.search('http://blog.nonstopsites.us/jquery/')" href="http://www.sphere.com/search?q=sphereit:http://blog.nonstopsites.us/jquery/">Sphere: Related Content</a></span><br/><br/>]]></content:encoded>
			<wfw:commentRss>http://blog.nonstopsites.us/jquery/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
