<?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>WebDesign &#38; Such &#187; Extensions</title>
	<atom:link href="http://webdesignandsuch.com/tag/extensions/feed/" rel="self" type="application/rss+xml" />
	<link>http://webdesignandsuch.com</link>
	<description>a Beantown Design Production</description>
	<lastBuildDate>Thu, 29 Jul 2010 00:02:25 +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>How to create fading links in Dreamweaver</title>
		<link>http://webdesignandsuch.com/2009/04/how-to-create-fading-links-in-dreamweaver/</link>
		<comments>http://webdesignandsuch.com/2009/04/how-to-create-fading-links-in-dreamweaver/#comments</comments>
		<pubDate>Sun, 12 Apr 2009 19:53:46 +0000</pubDate>
		<dc:creator>ilz</dc:creator>
				<category><![CDATA[Dreamweaver]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[CSS links]]></category>
		<category><![CDATA[Extensions]]></category>
		<category><![CDATA[Fading links]]></category>

		<guid isPermaLink="false">http://webdesignandsuch.com/?p=93</guid>
		<description><![CDATA[
			
				
			
		


I recently created this website for Professional Makeup artist Dani Wagener of Boston, Mass. When I was designing this site I decided to try out a technique I stumbled across: making fading link colors on rollovers. What I mean by this is that when you roll over the main navigation the links fade from gray [...]]]></description>
			<content:encoded><![CDATA[<div class="tweetmeme_button" style="float: right; margin-left: 10px; margin-bottom:10px">
			<a href="http://api.tweetmeme.com/share?url=http%3A%2F%2Fwebdesignandsuch.com%2F2009%2F04%2Fhow-to-create-fading-links-in-dreamweaver%2F"><br />
				<img src="http://api.tweetmeme.com/imagebutton.gif?url=?url=http%3A%2F%2Fwebdesignandsuch.com%2F2009%2F04%2Fhow-to-create-fading-links-in-dreamweaver%2F&amp;style=normal" height="61" width="51" /><br />
			</a>
		</div>
<p><img alt="" src="http://webdesignandsuch.com/imagesForPosts/dani.jpg" title="Fading Links" class="alignnone" width="500" height="324" class="frame"/></p>
<p>
I recently created this website for Professional Makeup artist Dani Wagener of Boston, Mass. When I was designing this site I decided to try out a technique I stumbled across: making <strong>fading link colors on rollovers</strong>. What I mean by this is that when you roll over the main navigation the links fade from gray to blue; instead of just switching right to the color like a CSS rollover would do. Check out the final result, and then I&#8217;ll explain how to do this effect in Dreamweaver. <a href="http://daniwagener.com/index.html">DaniWagener.com</a></p>
<p><span id="more-93"></span></p>
<p>The first step is to download and install the dreamweaver extension from the guys over at KaosWeaver. <a href="http://www.kaosweaver.com/extensions/details.php?id=60">Click here to get the extension</a>. Download that, install it, and we are ready to go.</p>
<p>Inside Dreamweaver, highlight a link and go to your Behaviors panel. If you installed the extension properly, you will now have a Kaos option in your menu, like this:
<p><img alt="" src="http://webdesignandsuch.com/imagesForPosts/fade.jpg" title="Fade Links" class="alignnone" width="300" height="449" class="frame"/></p>
<p>Select that and it will pop open a box that lets you choose a start and end color for you fading links. I chose medium speed for Dani&#8217;s site.</p>
<p><img alt="" src="http://webdesignandsuch.com/imagesForPosts/fade-link.jpg" title="Fade Links" class="alignnone" width="339" height="302" class="frame"/></p>
<p>Now you are done, it was that easy! There is one other thing I recommend however.. This effect requires Javascipt to work, so you should go ahead and create regular CSS rollovers for the links. So for example, I made the links be blue on the rollover, so if you turn the Javascript off on your browser, you see we still have a rollover effect.</p>
<p><strong>ilz out</strong></p>
]]></content:encoded>
			<wfw:commentRss>http://webdesignandsuch.com/2009/04/how-to-create-fading-links-in-dreamweaver/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
