Membuat menu Navigasi Thumbail Blogger

0 0 Edit this post

    DEMO   <!-- This Is A CopyRight Code Of www.exeideas.com It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Chan... 

 
 
DEMO
 
<!-- This Is A CopyRight Code Of www.exeideas.com It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Credits Should Be Under Legal Action Via DMCA. -->
<style>
/* Main Nav Bar DIV CSS Start */
#exe_nav_main {
margin:0 auto;
width:960px;
height:35px;
font: normal 14px/1.25em helvetica,arial,verdana,sans-serif;
}
#exe_nav_main a {
text-decoration:none;
color: #047da5;
}
/* Main Nav Bar DIV CSS End */
/* Main Nav Bar CSS Start */
#exe_nav {
position:absolute;
width:960px;
padding:0px;
margin:0px;
background: #d5d5d5; /* Old browsers */
background: -moz-linear-gradient(top,  #d5d5d5 0%, #fefefe 3%, #fefefe 21%, #f3f3f3 68%, #f1f1f1 97%, #9ebbc5 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d5d5d5), color-stop(3%,#fefefe), color-stop(21%,#fefefe), color-stop(68%,#f3f3f3), color-stop(97%,#f1f1f1), color-stop(100%,#9ebbc5)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #d5d5d5 0%,#fefefe 3%,#fefefe 21%,#f3f3f3 68%,#f1f1f1 97%,#9ebbc5 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #d5d5d5 0%,#fefefe 3%,#fefefe 21%,#f3f3f3 68%,#f1f1f1 97%,#9ebbc5 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #d5d5d5 0%,#fefefe 3%,#fefefe 21%,#f3f3f3 68%,#f1f1f1 97%,#9ebbc5 100%); /* IE10+ */
background: linear-gradient(to bottom,  #d5d5d5 0%,#fefefe 3%,#fefefe 21%,#f3f3f3 68%,#f1f1f1 97%,#9ebbc5 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d5d5d5', endColorstr='#9ebbc5',GradientType=0 ); /* IE6-9 */
}
li.exe_nav_main_li:first-child {
margin-left:0px;
}
li.exe_nav_main_li {
border-right: 1px solid #d5d5d5;
min-width: 45px;
padding: 0px 15px;
list-style-type: none;
display:inline-block;
height: 34px;
line-height: 34px;
font-size: 14px;
margin-left:-5px;
}
li.exe_nav_main_li:hover {
background: #39abd2; /* Old browsers */
background: -moz-linear-gradient(top,  #39abd2 0%, #2fa3ca 24%, #0c86af 76%, #017da7 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#39abd2), color-stop(24%,#2fa3ca), color-stop(76%,#0c86af), color-stop(100%,#017da7)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #39abd2 0%,#2fa3ca 24%,#0c86af 76%,#017da7 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #39abd2 0%,#2fa3ca 24%,#0c86af 76%,#017da7 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #39abd2 0%,#2fa3ca 24%,#0c86af 76%,#017da7 100%); /* IE10+ */
background: linear-gradient(to bottom,  #39abd2 0%,#2fa3ca 24%,#0c86af 76%,#017da7 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#39abd2', endColorstr='#017da7',GradientType=0 ); /* IE6-8 */
}
#exe_nav li.exe_nav_main_li:hover a {
color: #fff;
}
#exe_nav li:hover .exe_nav_sub {
display:block;
}
/* Main Nav Bar CSS End */
/* Main Nav Bar DropDown DIV CSS Start */
.exe_nav_sub {
display:none;
position:absolute;
top:34px;
left:0px;
width:940px;
padding:10px;
background: #ededed;
-moz-box-shadow: 0 10px 20px -12px #000;
-webkit-box-shadow: 0 10px 20px -12px #000;
box-shadow: 0 10px 20px -12px #000;
border-top: 2px #0f7ea6 solid;
}
.exe_nav_sub ul li a {
color: #047da5 !important;
}
/* Main Nav Bar DropDown DIV CSS End */
.exe_nav_sub_links_title{
font-size: 18px;
font-style: italic;
font-weight: 700;
padding: 12px 0 3px;
text-shadow: 1px 2px 2px #fff;
color: #b2b2b2;
}
/*Recommended CSS Start*/
.exe_nav_sub_links {
float:left;
width:200px;
}
.exe_nav_sub_links ul {
background-color: #fff;
min-height: 150px;
-webkit-box-shadow: 0 1px 2px 0 #999;
-moz-box-shadow: 0 1px 2px 0 #999;
box-shadow: 0 1px 2px 0 #999;
padding: 10px;
margin-right: 5px;
}
.exe_nav_sub_links ul li {
padding:5px !important;
display: block !important;
line-height: 2em;}
.exe_nav_sub_links ul li:hover {
background-color:#047da5 !important;
color:#fff !important;
}
.exe_nav_sub_links ul li:hover a{
color:#fff !important;
}
/*Recommended CSS End*/
.exe_nav_sub_hot {
float:left;
width:740px;
}
.exe_nav_sub_hot ul{
textalign:center;
background-color: #fff;
min-height: 150px;
-webkit-box-shadow: 0 1px 2px 0 #999;
-moz-box-shadow: 0 1px 2px 0 #999;
box-shadow: 0 1px 2px 0 #999;
padding: 10px;
}
.exe_nav_sub_hot ul li{
list-style-type: none;
float:left;
margin-left:23px;
width: 152px;
line-height: 20px;
}
.exe_nav_sub_hot img {
width:150px;
height:100px;
margin-bottom: 5px;
}
</style>
<!--[if gte IE]>
<style type="text/css">
#exe_nav_main {display: none;}
</style>
<![endif]-->
<div id="exe_nav_main">
<ul id="exe_nav">
<li class="exe_nav_main_li"><a href="#">See Whats New</a></li>
<li class="exe_nav_main_li"><a href="#">MegaDropDown 1 &#9660;</a>
    <div class="exe_nav_sub">
        <div class="exe_nav_sub_links">
   <span class="exe_nav_sub_links_title">Recommended...!!!</span><br />
   <ul>
   <li><a href="#">Sub Menu 1.1</a></li>
   <li><a href="#">Sub Menu 1.2</a></li>
   <li><a href="#">Sub Menu 1.3</a></li>
   <li><a href="#">Sub Menu 1.4</a></li>
   </ul>
  </div>
  <div class="exe_nav_sub_hot">
   <span class="exe_nav_sub_links_title">Trending Now...!!!</span><br />
   <ul>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   </ul>
  </div>
    </div>
</li>
<li class="exe_nav_main_li"><a href="#">MegaDropDown 2 &#9660;</a>
    <div class="exe_nav_sub">
        <div class="exe_nav_sub_links">
   <span class="exe_nav_sub_links_title">Recommended...!!!</span><br />
   <ul>
   <li><a href="#">Sub Menu 2.1</a></li>
   <li><a href="#">Sub Menu 2.2</a></li>
   <li><a href="#">Sub Menu 2.3</a></li>
   <li><a href="#">Sub Menu 2.4</a></li>
   </ul>
  </div>
  <div class="exe_nav_sub_hot">
   <span class="exe_nav_sub_links_title">Trending Now...!!!</span><br />
   <ul>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   </ul>
  </div>
    </div>
</li>
<li class="exe_nav_main_li"><a href="#">MegaDropDown 3 &#9660;</a>
    <div class="exe_nav_sub">
        <div class="exe_nav_sub_links">
   <span class="exe_nav_sub_links_title">Recommended...!!!</span><br />
   <ul>
   <li><a href="#">Sub Menu 3.1</a></li>
   <li><a href="#">Sub Menu 3.2</a></li>
   <li><a href="#">Sub Menu 3.3</a></li>
   <li><a href="#">Sub Menu 3.4</a></li>
   </ul>
  </div>
  <div class="exe_nav_sub_hot">
   <span class="exe_nav_sub_links_title">Trending Now...!!!</span><br />
   <ul>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   </ul>
  </div>
    </div>
</li>
<li class="exe_nav_main_li"><a href="#">MegaDropDown 4 &#9660;</a>
    <div class="exe_nav_sub">
        <div class="exe_nav_sub_links">
   <span class="exe_nav_sub_links_title">Recommended...!!!</span><br />
   <ul>
   <li><a href="#">Sub Menu 4.1</a></li>
   <li><a href="#">Sub Menu 4.2</a></li>
   <li><a href="#">Sub Menu 4.3</a></li>
   <li><a href="#">Sub Menu 4.4</a></li>
   </ul>
  </div>
  <div class="exe_nav_sub_hot">
   <span class="exe_nav_sub_links_title">Trending Now...!!!</span><br />
   <ul>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   <li><a href="#"><img src="http://www.soccerplayingguide.com/image-files/thumbnail1.jpg" alt="YouAltText" title="YouAltText" /><br />Your Image News Title Goes Here...</a></li>
   </ul>
  </div>
    </div>
</li>
<li class="exe_nav_main_li"><a href="#">About Us</a></li>
<li class="exe_nav_main_li"><a href="#">Contact Us</a></li>
</ul>
</div>
<!-- This Is A CopyRight Code Of www.exeideas.com It Is Free To Use But With HTML Design Code.If AnyOne Found To Be Changing This Code Credits Should Be Under Legal Action Via DMCA. -->

SHARE:

Twitter Facebook Google Pinterest

COMMENTS

DISQUS
BLOGGER
Nama

artis BLOGGER CSS otomotif sport
false
ltr
item
Aneka Resposive: Membuat menu Navigasi Thumbail Blogger
Membuat menu Navigasi Thumbail Blogger
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC91z2KFh37hkPL-so0GFrhf54ryDsnkH4b6jp-NxpCehadysGZoENGMr544kqqD3P7aPCUGgMUhTrNKUr-svEVLJT9fSOf2FAKBmASxT-XpHkBzNa6WYyzgeVXwbMyUw63VVJYd45rmON/s320/CSS-Mega-DropDown-Menu.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC91z2KFh37hkPL-so0GFrhf54ryDsnkH4b6jp-NxpCehadysGZoENGMr544kqqD3P7aPCUGgMUhTrNKUr-svEVLJT9fSOf2FAKBmASxT-XpHkBzNa6WYyzgeVXwbMyUw63VVJYd45rmON/s72-c/CSS-Mega-DropDown-Menu.png
Aneka Resposive
https://anekarespon.blogspot.com/2016/11/membuat-menu-navigasi-thumbail-blogger.html
https://anekarespon.blogspot.com/
http://anekarespon.blogspot.com/
http://anekarespon.blogspot.com/2016/11/membuat-menu-navigasi-thumbail-blogger.html
true
6641014136173328522
UTF-8
Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy