<?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>Azure Web Design &#187; Mootools</title>
	<atom:link href="http://www.azurewebdesign.com/category/javascript/mootools/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.azurewebdesign.com</link>
	<description>We Know Web</description>
	<lastBuildDate>Thu, 15 Apr 2010 04:28:14 +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>Mootools 101: A Disappearing (Fading) Notification Message</title>
		<link>http://www.azurewebdesign.com/mootools-101-a-disappearing-fading-notification-message/</link>
		<comments>http://www.azurewebdesign.com/mootools-101-a-disappearing-fading-notification-message/#comments</comments>
		<pubDate>Thu, 02 Apr 2009 05:00:57 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Javascript]]></category>
		<category><![CDATA[Mootools]]></category>

		<guid isPermaLink="false">http://www.azurewebdesign.com/blog/?p=54</guid>
		<description><![CDATA[What I wanted to achieve: I wanted a disappearing notification message that pops up and fades out when a button is pressed. What you need: Mootools Core How I did it: Read up on Apress Mootools Essentials for about an hour and experimented on it. 1. Include mootools  and the script in the head. &#60;script [...]]]></description>
			<content:encoded><![CDATA[<h2>What I wanted to achieve:</h2>
<p>I wanted a disappearing notification message that pops up and fades out when a button is pressed.</p>
<h2>What you need:</h2>
<p>Mootools Core</p>
<h2>How I did it:</h2>
<p>Read up on Apress Mootools Essentials for about an hour and experimented on it.</p>
<p>1. Include mootools  and the script in the head.</p>
<pre>&lt;script src="mootools-1.2.1-core.js"&gt;&lt;/script&gt;</pre>
<pre>&lt;script type="text/javascript"&gt;

    function blink() {
        $('blinker').set('opacity',1);
        $('blinker').fade('out');
    }

    window.addEvent('domready',function(){
        $('blinker').set('opacity',0);
    });

&lt;/script&gt;</pre>
<p>2. Type in the notification message and the button</p>
<pre>&lt;div&gt;
    &lt;p id="blinker"&gt;This is a disappearing notification message&lt;/p&gt;
&lt;/div&gt;

&lt;button onclick="blink()"&gt;Poink&lt;/button&gt;</pre>
<p>That&#8217;s it folks!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.azurewebdesign.com/mootools-101-a-disappearing-fading-notification-message/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
