
<?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>Simon Creative &#187; API</title>
	<atom:link href="http://www.simoncreative.com/tag/api/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.simoncreative.com</link>
	<description>Design, Web 2.0 Development and Photography</description>
	<lastBuildDate>Wed, 05 May 2010 02:04:56 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Interface Controlled by Weather &amp; Time</title>
		<link>http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/</link>
		<comments>http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/#comments</comments>
		<pubDate>Sat, 07 Mar 2009 06:09:20 +0000</pubDate>
		<dc:creator>Simon</dc:creator>
				<category><![CDATA[Web]]></category>
		<category><![CDATA[API]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Dynamic]]></category>
		<category><![CDATA[Javascript]]></category>
		<category><![CDATA[PHP]]></category>
		<category><![CDATA[XHTML]]></category>

		<guid isPermaLink="false">http://www.simoncreative.com/blog/2009/03/09/interface-controled-by-weather-time/</guid>
		<description><![CDATA[<a class="lightview" href="http://www.simoncreative.com/wp-content/uploads/2009/03/tisha-night.png"><img class="alignleft size-medium wp-image-148" title="Tisha Creative Night" src="http://www.simoncreative.com/wp-content/uploads/2009/03/tisha-night-200x138.png" alt="Tisha Creative Night" width="200" height="138" /></a>I've designed <a href="http://www.tishacreative">Tisha Creative</a>'s header by stacking 2 Images on top of one another. The top layer composed of a transparent PNG file sits on top of a bottom layer containing the backdrop image. The effect of resizing the browser window and seeing the skyline slide along the backdrop is achieved through Using 2 separate background styles for each of the DIV tags containing the images.]]></description>
			<content:encoded><![CDATA[<p><a class="lightview" href="http://www.simoncreative.com/wp-content/uploads/2009/03/tisha-night.png"><img class="alignleft size-medium wp-image-148" title="Tisha Creative Night" src="http://www.simoncreative.com/wp-content/uploads/2009/03/tisha-night-200x138.png" alt="Tisha Creative Night" width="200" height="138" /></a>I&#8217;ve designed <a href="http://www.tishacreative">Tisha Creative</a>&#8217;s header by stacking 2 Images on top of one another. The top layer composed of a transparent PNG file sits on top of a bottom layer containing the backdrop image. The effect of resizing the browser window and seeing the skyline slide along the backdrop is achieved through Using 2 separate background styles for each of the DIV tags containing the images.</p>
<p>Having successfully achieved the effect I wanted to take it a step further by having the 2 images change based on local time here in Hoboken, NJ, giving our site a more personal feel. Our CEO however, gave me a challenge by stating how great it would be to have our site changed based on our local weather conditions.</p>
<p>The biggest challenge was finding a weather source online with an open API. I found that not only was Yahoo the ideal solution for this task, but that the site had over 47 different potential weather conditions for any US zip code allowing me to pull the variable directly through an RSS feed.</p>
<p><a class="lightview" href="http://www.simoncreative.com/wp-content/uploads/2009/03/tisha-storm.png"><img class="alignleft size-medium wp-image-149" title="Tisha Creative Storm" src="http://www.simoncreative.com/wp-content/uploads/2009/03/tisha-storm-200x138.png" alt="Tisha Creative Storm" width="200" height="138" /></a>I chose to work with the top 9 weather conditions, by creating 9 CSS files which load on the site based on the current forecast here in Hoboken. Combined with the day and night script the <a href="http://www.tishacreative.com">Tisha Creative</a> website has 18 distinct looks which will load based on time and weather.</p>
<div id="crp_related"><h3>Related Posts:</h3><ul><li><a href="http://www.simoncreative.com/2009/06/24/iphone-version-of-tisha-creative/" rel="bookmark">iPhone version of Tisha Creative</a></li><li><a href="http://www.simoncreative.com/2009/03/05/tisha-creative/" rel="bookmark">Tisha Creative</a></li><li><a href="http://www.simoncreative.com/2009/11/19/h-mag-com-goes-live/" rel="bookmark">h-MAG.com goes live!</a></li><li><a href="http://www.simoncreative.com/2009/03/18/web-hosting-search-dilemma/" rel="bookmark">Web Hosting Search Dilemma</a></li><li><a href="http://www.simoncreative.com/2009/03/23/natalie-and-simon-dot-com/" rel="bookmark">Natalie and Simon dot com</a></li></ul></div>

<!-- Begin SexyBookmarks Menu Code -->
<div class="sexy-bookmarks sexy-bookmarks-expand sexy-bookmarks-center">
<ul class="socials">
		<li class="sexy-facebook">
			<a href="http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/&amp;t=Interface+Controlled+by+Weather+%26+Time" rel="" class="external" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="sexy-twitter">
			<a href="http://twitter.com/home?status=Interface+Controlled+by+Weather+%26+Time+-+http://e7t.us/4120eb+(via+@simondabkowski)" rel="" class="external" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="sexy-technorati">
			<a href="http://technorati.com/faves?add=http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/" rel="" class="external" title="Share this on Technorati">Share this on Technorati</a>
		</li>
		<li class="sexy-stumbleupon">
			<a href="http://www.stumbleupon.com/submit?url=http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/&amp;title=Interface+Controlled+by+Weather+%26+Time" rel="" class="external" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="sexy-myspace">
			<a href="http://www.myspace.com/Modules/PostTo/Pages/?u=http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/&amp;t=Interface+Controlled+by+Weather+%26+Time" rel="" class="external" title="Post this to MySpace">Post this to MySpace</a>
		</li>
		<li class="sexy-digg">
			<a href="http://digg.com/submit?phase=2&amp;url=http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/&amp;title=Interface+Controlled+by+Weather+%26+Time" rel="" class="external" title="Digg this!">Digg this!</a>
		</li>
		<li class="sexy-delicious">
			<a href="http://del.icio.us/post?url=http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/&amp;title=Interface+Controlled+by+Weather+%26+Time" rel="" class="external" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
</ul>
<div style="clear:both;"></div>
</div>
<!-- End SexyBookmarks Menu Code -->

]]></content:encoded>
			<wfw:commentRss>http://www.simoncreative.com/2009/03/07/interface-controlled-by-weather-time/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
