<?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>Free Blog Themes, Blog Tutorials, Blog Templates, Blogger Tips, Blog Resources &#187; linklist</title>
	<atom:link href="http://www.blogbunker.com/tag/linklist/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.blogbunker.com</link>
	<description>Free blogger templates, blogger tutorials, blogger tips, blogger guildes, blogger widgets, free wordpress plugins, free wordpress theme, blogger resources</description>
	<lastBuildDate>Sun, 22 Jan 2012 06:20:08 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>How To Add  Horizontal LinkList Blogger Jquery Tips</title>
		<link>http://www.blogbunker.com/blogger-tutorials/how-to-add-horizontal-linklist-blogger-jquery-tips/</link>
		<comments>http://www.blogbunker.com/blogger-tutorials/how-to-add-horizontal-linklist-blogger-jquery-tips/#comments</comments>
		<pubDate>Thu, 13 May 2010 21:56:34 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Blogger Tutorials]]></category>
		<category><![CDATA[Blogger Widgets]]></category>
		<category><![CDATA[add]]></category>
		<category><![CDATA[Blogger]]></category>
		<category><![CDATA[horizontal]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[linklist]]></category>
		<category><![CDATA[tips]]></category>

		<guid isPermaLink="false">http://www.blogbunker.com/blogger-tutorials/how-to-add-horizontal-linklist-blogger-jquery-tips/</guid>
		<description><![CDATA[<a href="http://www.blogbunker.com/blogger-tutorials/how-to-add-horizontal-linklist-blogger-jquery-tips/"><img align="left" hspace="5" width="100" src="https://blogger.googleusercontent.com/tracker/8685731215904055893-1584975387338305194?l=www.bloggerhome.net" class="alignleft wp-post-image tfe" alt="" title="" /></a>1.Log in to your dashboard&#8211;&#62; layout- -&#62; Edit HTML 2.Scroll down to where you see &#60;/b:skin&#62;tag. 3.Now copy below code and paste it just before &#60;/b:skin&#62; tag . #nav, #nav ul{margin:0;padding:0;list-style-type:none;list-style-position:outside;position:relative;line-height:26px;}#nav a:link,#nav a:active,#nav a:visited{display:block;color:#FFF;text-decoration:none;background:#444;height:26px;line-height:26px;padding:0 6px;margin-right:1px;}#nav a:hover{background:#0066FF;color:#FFF;}#nav li{float:left;position:relative;}#nav ul {position:absolute;width:12em;top:26px;display:none;}#nav li ul a{width:12em;float:left;}#nav ul ul{width:12em;top:auto;}#nav li ul ul {margin:0 0 0 13em;}#nav li:hover ul ul,#nav li:hover [...]]]></description>
			<content:encoded><![CDATA[<p>1.Log in to your dashboard&#8211;&gt; layout- -&gt; Edit HTML    <br />2.Scroll down to where you see &lt;/b:skin&gt;tag.     <br />3.Now copy below code and paste it just before &lt;/b:skin&gt; tag .</p>
<pre>#nav, #nav ul{margin:0;padding:0;list-style-type:none;list-style-position:outside;position:relative;line-height:26px;}#nav a:link,#nav a:active,#nav a:visited{display:block;color:#FFF;text-decoration:none;background:#444;height:26px;line-height:26px;padding:0 6px;margin-right:1px;}#nav a:hover{background:#0066FF;color:#FFF;}#nav li{float:left;position:relative;}#nav ul {position:absolute;width:12em;top:26px;display:none;}#nav li ul a{width:12em;float:left;}#nav ul ul{width:12em;top:auto;}#nav li ul ul {margin:0 0 0 13em;}#nav li:hover ul ul,#nav li:hover ul ul ul,#nav li:hover ul ul ul ul{display:none;}#nav li:hover ul,#nav li li:hover ul,#nav li li li:hover ul,#nav li li li li:hover ul{display:block;}</pre>
<p><a name='more'></a></p>
<p>Note: If you want you can change above code as you like. </p>
<p>4.Now again Scroll down to where you see &lt;/head&gt; tag. </p>
<p>5.Now Copy below code and paste it just before &lt;/head&gt; tag. </p>
<pre>&lt;script src='<a href="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js</a>' type='text/javascript'/&gt;&lt;script type='text/javascript'&gt;function showmenu(){$(&amp;quot;#nav li&amp;quot;).hover(function(){$(this).find(&#39;ul:first&#39;).css({visibility:&amp;quot;visible&amp;quot;, display:&amp;quot;none&amp;quot;}).show();}, function(){$(this).find(&#39;ul:first&#39;).css({visibility:&amp;quot;hidden&amp;quot;});});}

$(document).ready(function(){showmenu();});&lt;/script&gt;</pre>
<p>6.Now save your template. </p>
<p>7.Go to Layout&#8211;&gt;Page Elements. </p>
<p>8.Click on &quot;Add a Gadget&quot; and select &#8216;HTML/Javascript&#8217; and add the code given below. </p>
<pre>&lt;ul id=&quot;nav&quot;&gt;

&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 1&lt;/a&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 2&lt;/a&gt;&lt;ul&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 2.1&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 2.2&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 2.3&lt;/a&gt;&lt;/li&gt;&lt;ul&gt;&lt;/ul&gt;&lt;/ul&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 3&lt;/a&gt;&lt;ul&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 3.1&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 3.2&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 3.3&lt;/a&gt;&lt;/li&gt;&lt;ul&gt;&lt;/ul&gt;&lt;/ul&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 4&lt;/a&gt;&lt;ul&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 4.1&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 4.2&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 4.3&lt;/a&gt;&lt;/li&gt;&lt;ul&gt;&lt;/ul&gt;&lt;/ul&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 5&lt;/a&gt;&lt;ul&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 5.1&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 5.2&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 5.3&lt;/a&gt;&lt;/li&gt;&lt;ul&gt;&lt;/ul&gt;&lt;/ul&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href=&quot;#&quot;&gt;Link 6&lt;/a&gt;&lt;/li&gt;

&lt;/ul&gt;</pre>
<p>Replace # with your link urls and Link 1&#8230;.n with the text of links. </p>
<p>9.Now click save and you are done. </p>
<div><img width="1" height="1" src="https://blogger.googleusercontent.com/tracker/8685731215904055893-1584975387338305194?l=www.bloggerhome.net" alt="" /></div>
<p><a href="http://feedads.g.doubleclick.net/~a/GmxcNOvVKmdBRomf6hmZ6Nev8dc/0/da"><img src="http://feedads.g.doubleclick.net/~a/GmxcNOvVKmdBRomf6hmZ6Nev8dc/0/di" border="0"></img></a><br />
<a href="http://feedads.g.doubleclick.net/~a/GmxcNOvVKmdBRomf6hmZ6Nev8dc/1/da"><img src="http://feedads.g.doubleclick.net/~a/GmxcNOvVKmdBRomf6hmZ6Nev8dc/1/di" border="0"></img></a></p>
<p><img src="http://feeds.feedburner.com/~r/feed39/~4/kGAoTA2G6G0" height="1" width="1" /></p>
]]></content:encoded>
			<wfw:commentRss>http://www.blogbunker.com/blogger-tutorials/how-to-add-horizontal-linklist-blogger-jquery-tips/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

