<?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>Infinity Web Creations</title>
	<atom:link href="http://www.infinitywebcreations.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.infinitywebcreations.com</link>
	<description>The Possibilities Are Endless</description>
	<lastBuildDate>Sat, 30 Jul 2011 05:28:29 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Big Name Project Revealed</title>
		<link>http://www.infinitywebcreations.com/2011/06/big-name-project-revealed/</link>
		<comments>http://www.infinitywebcreations.com/2011/06/big-name-project-revealed/#comments</comments>
		<pubDate>Tue, 28 Jun 2011 02:31:22 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>
		<category><![CDATA[iggy]]></category>
		<category><![CDATA[mtv]]></category>
		<category><![CDATA[mtv iggy]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=214</guid>
		<description><![CDATA[At long last, the big name that I recently had the honor of working with launched their new site that I had a huge hand in developing. It&#8217;s been a real treat and a tremendous opportunity getting to work with MTV on their Iggy website. It has been a very exciting challenge and I loved [...]]]></description>
			<content:encoded><![CDATA[<p>At long last, the big name that I recently had the honor of working with launched their new site that I had a huge hand in developing.</p>
<p><a href="http://www.mtviggy.com" target="_blank"><img src="http://www.infinitywebcreations.com/wp-content/uploads/2011/06/mtviggy1.png" title="MTV Iggy" alt="MTV Iggy" /></a></p>
<p>It&#8217;s been a real treat and a tremendous opportunity getting to work with MTV on their Iggy website.</p>
<p>It has been a very exciting challenge and I loved every bit of it! It looks like more is on the horizon, but I can&#8217;t share details&#8230;yet.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/06/big-name-project-revealed/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>InfinityTracker entering BETA</title>
		<link>http://www.infinitywebcreations.com/2011/06/infinitytracker-entering-beta/</link>
		<comments>http://www.infinitywebcreations.com/2011/06/infinitytracker-entering-beta/#comments</comments>
		<pubDate>Sat, 25 Jun 2011 17:34:21 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[basecamp alternative]]></category>
		<category><![CDATA[codeigniter]]></category>
		<category><![CDATA[codeigniter 2]]></category>
		<category><![CDATA[infinity tracker]]></category>
		<category><![CDATA[php issue tracker]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=198</guid>
		<description><![CDATA[As I mentioned in February, I was looking for a Basecamp alternative. I looked into several options and spent a LOT of time trying to find something that was simple and pleasant to use, but it had to be self-hosted and written in PHP so I could extend it or fix bugs (and contribute if [...]]]></description>
			<content:encoded><![CDATA[<p>As I <a href="http://www.infinitywebcreations.com/2011/02/basecamp-alternative/">mentioned in February</a>, I was looking for a Basecamp alternative. I looked into several options and spent a LOT of time trying to find something that was simple and pleasant to use, but it had to be self-hosted and written in PHP so I could extend it or fix bugs (and contribute if they wanted) myself without having to wait on new releases if something was urgent.</p>
<p>
	I really enjoyed using <a href="http://retrospectiva.org/overview">Retrospectiva</a> while working on the &quot;BIG NAME&quot; contract (they haven&#39;t launched yet, so I can&#39;t say who it was just yet)&#8230; but it&#39;s based on Ruby. So that was out, but I *really* liked it. It was simple, clean and crisp. The user interface was unobtrusive&#8230; it gave me exactly what I needed, and stayed the hell out of my way. Productivity was great!</p>
<p>I&#39;ve also explored (and continue to use) <a href="http://www.activecollab.com/">ActiveCollab</a> with one of my clients who has used it for quite some time and seems to be satisfied with it. It is nice software, but it&#39;s MORE than what I wanted. In other words, it gets in the way for me.</p>
<p>Ideally, what I want is something that gets back to the basics, but does so in a very clean, unobtrusive manner, and does its job extremely well&#8230; just like Retrospectiva.</p>
<p>So I set out to develop my own solution:</p>
<p><a href="http://www.infinitywebcreations.com/wp-content/uploads/2011/06/2011-06-25_12271.png" style="border-bottom:0;"><img alt="InfinityTracker Demo Screenshot" src="http://www.infinitywebcreations.com/wp-content/uploads/2011/06/2011-06-25_12271.png" title="InfinityTracker Demo Screenshot" /></a></p>
<p>If you&#39;ve used Retrospectiva, you will probably see some similarity there. It doesn&#39;t have ALL of the features of Retrospectiva (or any other issue tracker)&#8230; but it includes what I feel are the most important features from all issue trackers that I&#39;ve used in the past.</p>
<p>It gets back to the basics, keeps it simple, lets you do your job and stays the hell out of your way.</p>
<p>Admins can create projects, create users, deactivate/suspend users, give users permission to access specific projects, etc. While users can access projects, create tickets, add comments, edit their profile, etc.</p>
<p>When creating a ticket, you can also upload an attachment, which is super useful when you need to upload a screenshot, word document, PDF, etc that people assigned to the ticket should have access to easily.</p>
<p>Each comment allows you to upload a new file as well, which has already come in extremely handy.</p>
<p>I should also mention that there is an email notification system in place as well. New ticket created? Email is sent to person creating ticket, and person assigned to ticket.</p>
<p>Comment added? Everybody subscribed to notifications to the ticket gets an email notification!</p>
<p>InfinityTracker is currently in BETA and is not open to the public yet. If you&#39;re interested in using InfinityTracker as a self-hosted solution for your own team, please contact me for details or leave a comment on this post. I am currently using it with several of my clients to work out any bugs that may show up.</p>
<p>And I can&#39;t conclude the post without giving credit to EllisLab and the fantastic CodeIgniter community, as InfinityTracker was built with CodeIgniter 2.0.2. Total development time, including initial design on paper, database design, web design, programming, debugging, etc&#8230; 5 days. That is the power of CodeIgniter and the M-V-C design pattern.</p>
<p>Thanks for reading, folks!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/06/infinitytracker-entering-beta/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Long time, no update!</title>
		<link>http://www.infinitywebcreations.com/2011/05/long-time-no-update/</link>
		<comments>http://www.infinitywebcreations.com/2011/05/long-time-no-update/#comments</comments>
		<pubDate>Sun, 15 May 2011 00:31:48 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=117</guid>
		<description><![CDATA[I apologize for the lack of updates over the past couple months! Thank you everybody for your continued business. It is very much appreciated . I&#8217;m currently super swamped on a project for a BIG name&#8230; deadline is approaching quickly. Once this project is over I&#8217;ll be back to my regular updates and blog posts [...]]]></description>
			<content:encoded><![CDATA[<p>I apologize for the lack of updates over the past couple months!</p>
<p>Thank you everybody for your continued business. It is very much appreciated <img src='http://www.infinitywebcreations.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> .</p>
<p>I&#8217;m currently super swamped on a project for a BIG name&#8230; deadline is approaching quickly. Once this project is over I&#8217;ll be back to my regular updates and blog posts <img src='http://www.infinitywebcreations.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>Thanks for your support! Please keep checking in!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/05/long-time-no-update/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Another successful job completed.</title>
		<link>http://www.infinitywebcreations.com/2011/02/another-successful-job-completed/</link>
		<comments>http://www.infinitywebcreations.com/2011/02/another-successful-job-completed/#comments</comments>
		<pubDate>Sat, 26 Feb 2011 03:17:32 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=114</guid>
		<description><![CDATA[I was honored to have the opportunity to work with this team in particular&#8230; a non-profit organization devoted to helping feed the homeless. Kassir Foundation called on my services and I was happy to do my part in helping make the world a better place in my own small way. Please take a moment to [...]]]></description>
			<content:encoded><![CDATA[<p>I was honored to have the opportunity to work with this team in particular&#8230; a non-profit organization devoted to helping feed the homeless. Kassir Foundation called on my services and I was happy to do my part in helping make the world a better place in my own small way. Please take a moment to check these folks out, and if you can and feel compelled to do so&#8230; make a donation of any size. It all helps.</p>
<p><a href="http://www.kassirfoundation.org/">http://www.kassirfoundation.org/</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/02/another-successful-job-completed/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Basecamp Alternative</title>
		<link>http://www.infinitywebcreations.com/2011/02/basecamp-alternative/</link>
		<comments>http://www.infinitywebcreations.com/2011/02/basecamp-alternative/#comments</comments>
		<pubDate>Mon, 21 Feb 2011 16:02:52 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>
		<category><![CDATA[basecamp]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=112</guid>
		<description><![CDATA[I&#39;m a big Basecamp fan, but I was wondering if anybody knew of any GOOD alternatives? I&#39;ve tried a few, but they all came up short. Been thinking about creating a new, free, open-source version that is as usable and streamlined as Basecamp&#8230; anybody have any alternatives before I start diving into code?]]></description>
			<content:encoded><![CDATA[<p>I&#39;m a big Basecamp fan, but I was wondering if anybody knew of any GOOD alternatives? I&#39;ve tried a few, but they all came up short. Been thinking about creating a new, free, open-source version that is as usable and streamlined as Basecamp&#8230; anybody have any alternatives before I start diving into code?</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/02/basecamp-alternative/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>My daughter turns 1 year old</title>
		<link>http://www.infinitywebcreations.com/2011/02/my-daughter-turns-1-year-old/</link>
		<comments>http://www.infinitywebcreations.com/2011/02/my-daughter-turns-1-year-old/#comments</comments>
		<pubDate>Fri, 11 Feb 2011 14:44:52 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=110</guid>
		<description><![CDATA[Our daughter, Rebecca, turned one year old today. Happy birthday, sweetheart! Mommy &#038; daddy love you very very much!!!!]]></description>
			<content:encoded><![CDATA[<p>Our daughter, Rebecca, turned one year old today. Happy birthday, sweetheart! Mommy &#038; daddy love you very very much!!!!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/02/my-daughter-turns-1-year-old/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Traffic has increased 1,000%</title>
		<link>http://www.infinitywebcreations.com/2011/02/traffic-has-increased-1000/</link>
		<comments>http://www.infinitywebcreations.com/2011/02/traffic-has-increased-1000/#comments</comments>
		<pubDate>Thu, 10 Feb 2011 15:45:41 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=108</guid>
		<description><![CDATA[Just wanted to give a quick thanks to everybody including my clients for helping boost traffic to this site 1,000%!!! And thank you everybody who has been contacting me, I greatly appreciate your business!]]></description>
			<content:encoded><![CDATA[<p>Just wanted to give a quick thanks to everybody including my clients for helping boost traffic to this site 1,000%!!!</p>
<p>And thank you everybody who has been contacting me, I greatly appreciate your business!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/02/traffic-has-increased-1000/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Should You Hire From USA or India?</title>
		<link>http://www.infinitywebcreations.com/2011/02/should-you-hire-from-usa-or-india/</link>
		<comments>http://www.infinitywebcreations.com/2011/02/should-you-hire-from-usa-or-india/#comments</comments>
		<pubDate>Sun, 06 Feb 2011 16:48:21 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[Main]]></category>
		<category><![CDATA[hire domestic]]></category>
		<category><![CDATA[india]]></category>
		<category><![CDATA[third world country programmers]]></category>
		<category><![CDATA[usa programmers]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=106</guid>
		<description><![CDATA[I see this a lot, and to be honest, I&#39;m not terribly concerned about it myself and I&#39;ll explain why below. The big question&#8230; should you hire a USA programmer or a programmer from India (or other third-world country)? When hiring from outside of USA, you are likely to be spending about half the cost [...]]]></description>
			<content:encoded><![CDATA[<p>I see this a lot, and to be honest, I&#39;m not terribly concerned about it myself and I&#39;ll explain why below.</p>
<p>The big question&#8230; should you hire a USA programmer or a programmer from India (or other third-world country)? When hiring from outside of USA, you are likely to be spending about half the cost per hour than you would if you hired from the USA.</p>
<p>True, they do have a lower cost of living and so they can afford to work for less. What&#39;s also true is the old saying, &quot;You get what you pay for.&quot; This is especially true in the web industry.</p>
<p>While you&#39;re paying more, you&#39;re paying for <strong>quality</strong> work which will be more flexible, better extended in future, and robust. Not only that, but you&#39;ll also have your project completed <strong>faster</strong>. And I&#39;m only speaking generally here. There are some shoddy US-based programmers as well&#8230; some that just don&#39;t care, to some that are just starting out. But overall, you will get far better quality from a US-based programmer or team.</p>
<p>And not surprisingly, when factoring overall costs, US-based programmers often come at the same cost or even CHEAPER than India-based companies. The timezone gap and communication barrier presents an enormous challenge. Not only are you practically guaranteed that your final product will be something other than what you envisioned, but it&#39;s going to be a very frustrating work experience the whole time.</p>
<p>So you have to ask yourself&#8230; is my idea.. my project&#8230;<strong>my future</strong>&#8230;&#8230;. is it worth spending a little extra per hour to get an end-result that is leaps and bounds more robust and stable and flexible than it would be otherwise?</p>
<p>When I&#39;m working with my clients, I work with them in real-time. They see my screen, in real time, as I work. This allows unparalleled collaboration short of working together in person. Not only do you verify that I&#39;m actually DOING the work when I say I&#39;m doing it, but you&#39;re there along every step of the way able to quickly catch any mis-communications, or when new ideas come to mind, we are able to immediately discuss and implement those new ideas!</p>
<p>All of my clients are repeat clients. That&#39;s right. <strong>100% of my clients have come back to me for more.</strong> And about HALF of my clients are people who have worked with third-world country programming teams who have upset them so much that they were forced to seek an alternative, better programmer who can actually make their plans and ideas a reality, quickly. Once a client switches to me, they are part of the Infinity Web Creations family for life&#8211;they refuse to leave because I deliver only top quality at an affordable price. I&#39;ve not heard the same said for ANY third-world country programming team in my 10+ years in this industry.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/02/should-you-hire-from-usa-or-india/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>jQuery 1.5 released!</title>
		<link>http://www.infinitywebcreations.com/2011/02/jquery-1-5-released/</link>
		<comments>http://www.infinitywebcreations.com/2011/02/jquery-1-5-released/#comments</comments>
		<pubDate>Tue, 01 Feb 2011 06:12:10 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[jquery 1.5]]></category>
		<category><![CDATA[jquery released]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=96</guid>
		<description><![CDATA[As everybody who knows me knows&#8230; I&#39;m a huge fan of jQuery. So needless to say, the next major release of jQuery (1.5) has me extremely excited! We are told that the largest charge to jQuery with this version is AJAX. It has been completely rewritten in jQuery. Instead of returning a regular XMLHttpRequest object, [...]]]></description>
			<content:encoded><![CDATA[<p>As everybody who knows me knows&#8230; I&#39;m a huge fan of jQuery. So needless to say, the next major release of jQuery (1.5) has me extremely excited!</p>
<p>We are told that the largest charge to jQuery with this version is AJAX. It has been completely rewritten in jQuery. Instead of returning a regular XMLHttpRequest object, jQuery.ajax(&#8230;) now returns a jXHR object. This allows you to perform previously impossible tasks like aborting JSONP requests, according to the <a href="http://blog.jquery.com/2011/01/31/jquery-15-released/">jQuery blog.</a></p>
<p>jQuery 1.5 also introduces <a href="http://api.jquery.com/category/deferred-object/">deferred objects</a>. This is a chainable utility object that can register multiple callbacks into callback queues, invoke callback queues, and relay the success or failure state of any synchronous or asynchronous function.</p>
<p>And finally, one of the most exciting changes in jQuery 1.5 is the massive performance increase in traversal functionality. Calls to .children(), .next() and .prev() have been dramatically sped up.</p>
<p><img alt="" class="alignnone" height="375" src="http://farm6.static.flickr.com/5260/5404543235_dcdd4cf714.jpg" title=".children() Performance in jQuery 1.5" width="500" /></p>
<p><img alt="" class="alignnone" height="375" src="http://farm6.static.flickr.com/5099/5404543659_82b480e578.jpg" title=".prev() Performance in jQuery 1.5" width="500" /></p>
<p><img alt="" class="alignnone" height="375" src="http://farm6.static.flickr.com/5012/5404544105_66670184f3.jpg" title=".next() Performance in jQuery 1.5" width="500" /></p>
<p>This was just a quick overview of the changes jQuery 1.5, and more importantly a notification that you should go get jQuery 1.5 immediately and start experiencing the changes for yourselves! Full information on the jQuery 1.5 release can be found at: <a href="http://blog.jquery.com/2011/01/31/jquery-15-released/">http://blog.jquery.com/2011/01/31/jquery-15-released/</a></p>
<p>Thanks for reading!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/02/jquery-1-5-released/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>How to Create a Throbbing/Pulsing Image Effect With jQuery</title>
		<link>http://www.infinitywebcreations.com/2011/01/how-to-create-a-throbbingpulsing-image-effect-with-jquery/</link>
		<comments>http://www.infinitywebcreations.com/2011/01/how-to-create-a-throbbingpulsing-image-effect-with-jquery/#comments</comments>
		<pubDate>Thu, 27 Jan 2011 13:29:09 +0000</pubDate>
		<dc:creator>Mike</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jquery opacity pulse]]></category>
		<category><![CDATA[jquery pulse]]></category>
		<category><![CDATA[jquery throb]]></category>
		<category><![CDATA[jquery throbbing]]></category>

		<guid isPermaLink="false">http://www.infinitywebcreations.com/?p=73</guid>
		<description><![CDATA[I received a request from a client of mine who sought my help after his other developer was unable to perform a specific task using jQuery, and they didn&#39;t want to revert to Flash. As you probably guessed, he wanted a throbbing or pulsing image effect. An image (several, actually) were to &#34;fade&#34; in &#38; [...]]]></description>
			<content:encoded><![CDATA[<p>I received a request from a client of mine who sought my help after his other developer was unable to perform a specific task using jQuery, and they didn&#39;t want to revert to Flash. As you probably guessed, he wanted a throbbing or pulsing image effect. An image (several, actually) were to &quot;fade&quot; in &amp; out partially, to give the desired illusion when hovering over the image with your mouse. Not only that, but the effect needed to continue repeating as long as the mouse was hovering over the image.</p>
<p>I&#39;ve never built such an effect before, and was unable to really locate any help with it via Google and so after a few minutes of planning and experimenting, my appreciation for jQuery&#39;s simplicity and power was once again renewed. Here, I&#39;ll explain how to achieve the effect and show a demo of it since nobody else has documented it that I could find.</p>
<p>To demonstrate the effect I&#39;m going to show you how to reproduce, take your mouse and hover over this image:</p>
<p><script type="text/javascript" src="/js/pulse_image.js"></script>
<p><img alt="Demo Headshot for throbbling / pulsing jQuery effect" class="pulse_image alignnone size-full wp-image-76" height="277" src="http://www.infinitywebcreations.com/wp-content/uploads/2011/01/headshot.png" width="162" /></p>
<p>Neat? I thought it was. And thanks to jQuery, the effect can be had with MINIMAL work. In fact, I&#39;m going to provide the code for you copy/paste-type folks, and then explain how it works.</p>
<p>&nbsp;</p>
<pre style="border: 1px solid rgb(204, 204, 204); background-color: rgb(255, 255, 255); padding: 15px;">// #############################################
(function($) {
	$(document).ready(function() {
		window.pulse_image = null;
		window.pulse_continue_loop = false;

		$(&#39;.pulse_image&#39;).mouseover(function() {
			// User is hovering over the image.
			window.pulse_continue_loop = true;
			window.pulse_image = $(this);

			PulseAnimation(); // start the loop
		}).mouseout(function() {
			window.pulse_continue_loop = false;
			window.pulse_image.stop();
			window.pulse_image.css(&#39;opacity&#39;,1);
		});
	});
})(jQuery);

// #############################################
function PulseAnimation()
{
	var minOpacity = .33;
	var fadeOutDuration = 650;
	var fadeInDuration = 650;

	window.pulse_image.animate({
		opacity: minOpacity
	}, fadeOutDuration, function() {
		window.pulse_image.animate({
			opacity: 1
		}, fadeInDuration, function() {
			if(window.pulse_continue_loop) {
				PulseAnimation();
			}
		})
	});
}
</pre>
<ol>
<li>Copy and paste the above code into a file (I&#39;m using /js/pulse_image.js).</li>
<li>Make any changes you&#39;d like to the <strong>minOpacity</strong>, <strong>fadeOutDuration</strong>, <strong>fadeInDuration</strong> (duration is specified in milliseconds; 1000ms = 1 second)</li>
<li>Link to the javascript file within your web-page. I&#39;m assuming you&#39;ve already linked to jQuery.</li>
<li>Give your image or images that you want to have this effect a class of <strong>pulse_image</strong>.</li>
<li>Enjoy!</li>
</ol>
<p>For those who are still reading, I&#39;m going to assume you want to know how it works. It&#39;s actually quite simple.</p>
<p>We set 2 global variables called <strong>pulse_image</strong> and <strong>pulse_continue_loop</strong>.</p>
<p>window.<strong>pulse_image</strong> is a jQuery object for the CURRENT image that is being hovered, or previous image that was being hovered.</p>
<p>window.<strong>pulse_continue_loop</strong> tells us whether we want to continue the pulse effect animation or not. This is a boolean flag.</p>
<p>When the DOM is ready, we initialize those two global variables and then create our event handlers. When any element with a class of <strong>pulse_image</strong> has its mouseover event fired, we set our <strong>pulse_continue_loop</strong> flag to TRUE, because we do want a constant pulsing effect. We also assign <strong>the pulse_image</strong> variable a jQuery object that is for the current image being hovered. Finally, we start the animation by calling PulseAnimation().</p>
<p>Next, we need to handle when the image is no longer being hovered. When this event fires, we set <strong>pulse_continue_loop</strong> to FALSE, because we&#39;re done with the animation&#8230; the mouse is no longer hovering. In addition, we want the current animation to stop, so we call <strong>pulse_image</strong>.stop(). Since we may have stopped that animation mid-fade, we set the image&#39;s opacity back to 100% (1).</p>
<p>So now we&#39;ve directed what should happen, when&#8230; but still need the actual WORK done. This is where the PulseAnimation() function we called earlier comes in.</p>
<p>Here, we have 3 local variables we can set to configure the dynamics of our animation. Those are pretty self-explanatory and the defaults work very well. Experiment as you wish.</p>
<p>We take our image, <strong>pulse_image</strong>, and create an animation. The only effect we&#39;re doing is setting the opacity to <strong>minOpacity</strong> which is defined above. We specify our <strong>fadeOutDuration</strong>, and then our callback function. Within our callback function, we&#39;re starting a NEW animation, which sets the opacity back to 100% (1), over a period of time specified by <strong>fadeInDuration</strong>, which then has its own callback.</p>
<p>Within the second animation&#39;s callback, we check if we need to continue looping or not (via <strong>pulse_continue_loop</strong> global variable). If true, we call PulseAnimation() which starts the initial animation over again, and the cycle repeats. This is our exit strategy which is vital or else we would be stuck in an infinite loop. <strong>pulse_continue_loop</strong> gets set to FALSE whenever the mouse stops hovering over the image, effectively stopping our loop when the animation is no longer needed.</p>
<p>So there we have it. In 39 lines of code, we achieved a throbbing or pulsing effect with jQuery. We can make any number of images have this animation, and in fact it&#39;s not limited to only images!</p>
<h1 class="pulse_image">Mouse Over Me!</h1>
<p>All that&#39;s needed to be done is adding a simple class to any element that you want to have the effect. It doesn&#39;t get much easier than that. Thanks, jQuery!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.infinitywebcreations.com/2011/01/how-to-create-a-throbbingpulsing-image-effect-with-jquery/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

