<?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 women &#187; javascript</title>
	<atom:link href="http://www.webdesign-women.com/tag/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.webdesign-women.com</link>
	<description>we design the web!</description>
	<lastBuildDate>Tue, 25 Oct 2011 12:24:58 +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>About Tooltips in Menues and for Links</title>
		<link>http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/</link>
		<comments>http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/#comments</comments>
		<pubDate>Sun, 21 Feb 2010 19:21:42 +0000</pubDate>
		<dc:creator>pixelhorse</dc:creator>
				<category><![CDATA[Coding]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[tooltip]]></category>

		<guid isPermaLink="false">http://www.webdesign-women.com/?p=18</guid>
		<description><![CDATA[Tooltips for links in html documents can be modified, designed or deleted. Where do they come from? Who needs them? <a href="http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/">Read more <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Tooltips are a good thing for a better usability in webdesign &#8211; you find a good description about them in wikipedia: <a href="http://en.wikipedia.org/wiki/Tooltip" target="_blank">http://en.wikipedia.org/wiki/Tooltip</a>. They are shown when you hover a link or menu element. With css you can modify the tip as you like.</p>
<h2>Design of tooltips for links &#8211; with javascript</h2>
<p>A javascript based library by Walter Zorn you find <a href="http://www.walterzorn.com/tooltip/tooltip_e.htm" target="_blank">here</a>. Another Version at <a href="http://www.dyn-web.com/code/tooltips/" target="_blank">dyn-web.com</a>. Based on the javascript library jQuery a plugin helps to design tooltips &#8211; find more about it <a href="http://flowplayer.org/tools/tooltip.html" target="_blank">here</a>.</p>
<h2>and css only</h2>
<p>A better way for all users would be to use css  <a href="http://lixlpixel.org/css_tooltip/" target="_blank">http://lixlpixel.org/css_tooltip/</a> and as whole popups here: <a href="http://meyerweb.com/eric/css/edge/popups/demo.html" target="_blank">http://meyerweb.com/eric/css/edge/popups/demo.html</a></p>
<h2>Some love it some hate it</h2>
<p>In case you design a menu an extra tooltip could disturb the user. Often tooltips are used to explain a link &#8211; but in a menu it&#8217;s clear and not good to use. What can you do &#8211; where does they come from? Each link with a title attribute will show a tooltip. So the easiest thing to do would be to delete <a title="the title ..." href="#">the title attribut</a> within the link.</p>
<p>Special Joomla: In the basic mainmenu there are no titles &#8211; fine &#8211; but some people think they need them, so you use the <a href="http://de.siteof.de/extended-menu.html" target="_blank">extended menu</a> module to add them.</p>
<p>For SEO reasons, titles can be useful. They are good if they give extra information about the link &#8211; but in a menu you should avoid just to repeat the link name in the title.</p>


<div class="shr-bookmarks shr-bookmarks-expand">
<ul class="socials">
		<li class="shr-comfeed">
			<a href="http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/feed" rel="nofollow" title="Subscribe to the comments for this post?">Subscribe to the comments for this post?</a>
		</li>
		<li class="shr-delicious">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=2&amp;tags=&amp;ctype=" rel="nofollow" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
		<li class="shr-facebook">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=5&amp;tags=&amp;ctype=" rel="nofollow" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="shr-googlebuzz">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=257&amp;tags=&amp;ctype=" rel="nofollow" title="Post on Google Buzz">Post on Google Buzz</a>
		</li>
		<li class="shr-misterwong">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=6&amp;tags=&amp;ctype=" rel="nofollow" title="Add this to Mister Wong">Add this to Mister Wong</a>
		</li>
		<li class="shr-stumbleupon">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=38&amp;tags=&amp;ctype=" rel="nofollow" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="shr-twitter">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=%24%7Btitle%7D+-+%24%7Bshort_link%7D&amp;service=7&amp;tags=&amp;ctype=" rel="nofollow" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="shr-blogger">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=219&amp;tags=&amp;ctype=" rel="nofollow" title="Blog this on Blogger">Blog this on Blogger</a>
		</li>
		<li class="shr-designbump">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=282&amp;tags=&amp;ctype=" rel="nofollow" title="Bump this on DesignBump">Bump this on DesignBump</a>
		</li>
		<li class="shr-gmail">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=52&amp;tags=&amp;ctype=" rel="nofollow" title="Email this via Gmail">Email this via Gmail</a>
		</li>
		<li class="shr-googlebookmarks">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=74&amp;tags=&amp;ctype=" rel="nofollow" title="Add this to Google Bookmarks">Add this to Google Bookmarks</a>
		</li>
		<li class="shr-googlereader">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=207&amp;tags=&amp;ctype=" rel="nofollow" title="Add this to Google Reader">Add this to Google Reader</a>
		</li>
		<li class="shr-linkedin">
			<a href="http://www.shareaholic.com/api/share/?title=About+Tooltips+in+Menues+and+for+Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=88&amp;tags=&amp;ctype=" rel="nofollow" title="Share this on LinkedIn">Share this on LinkedIn</a>
		</li>
		<li class="shr-mail">
			<a href="http://www.shareaholic.com/api/share/?title=About%20Tooltips%20in%20Menues%20and%20for%20Links&amp;link=http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/&amp;notes=Tooltips%20for%20links%20in%20html%20documents%20can%20be%20modified%2C%20designed%20or%20deleted.%20Where%20do%20they%20come%20from%3F%20Who%20needs%20them%3F&amp;short_link=&amp;shortener=tinyurl&amp;shortener_key=&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=201&amp;tags=&amp;ctype=" rel="nofollow" title="Email this to a friend?">Email this to a friend?</a>
		</li>
</ul><div style="clear: both;"></div><div class="shr-getshr" style="visibility:hidden;font-size:10px !important"><a target="_blank" href="http://www.shareaholic.com/?src=pub">Get Shareaholic</a></div><div style="clear: both;"></div></div>

]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-women.com/about-tooltips-in-menues-and-for-links/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

