Mahindra Suryaning Praja

Mahindra Suryaning Praja Full Imagination

  • RSS
  • Delicious
  • Facebook
  • Twitter

MY PHOTOS

MAHENDRA SURYANING PRAJA
LAKUKAN APA YANG BELUM PERNAH KAMU LAKUKAN
JADI DIRIMU SENDIRI, TAPI JADI DIRIMU DIRI YANG TERBAIK

me

me

Popular Posts

Pengikut

Thumbnail Recent Post

Blog Archive

IP
free counters

BY MAHENDRA

Sebenarnya Anda lebih berani dari yang anda duga, lebih kuat dari yang anda tahu, dan lebih pintar yang anda kira, namun itu semua tersembunyi dibalik diding tipis bernama keragu-raguan. ...

LAKUKAN INI

Satu-satunya cara untuk melakukan pekerjaan besar adalah dengan mencintai apa yang Anda lakukan, walaupun sebenarnya anda membencinya...

UDINUS COMUNITY.

Kegagalan adalah peluang untuk hal yang lebih baik. Kegagalan adalah batu loncatan untuk pengalaman yang berharga. Suatu hari nanti Anda akan bersyukur untuk beberapa kegagalan yang anda alami. Percayalah, ketika satu pintu tertutup untuk anda, sebenarnya pintu yang lain selalu terbuka...

DOSCOM IS MY PLACE

"Tajamnya kata lebih membekas dihati sampai bertahun-tahun bahkan teringat seumur hidup,jadi jagalah lisanmu jangan mengukir luka dihati, Mencari 1000 orang musuh lebih Gampang dripada mencari 1 orang SAHABAT. Jadi jagalah persahabatan Kalian" ...

SADEWA 3 NO 17

Sebenarnya sangatlah mudah menjadi Bahagia. Kebahagiaan akan datang saat kita memaafkan diri kita sendiri, memaafkan orang lain, dan hidup dengan penuh rasa syukur. Tidak pernah ada orang egois dan tidak tahu berterima kasih mampu merasakan bahagia, apalagi membuat orang lain bahagia. Hidup ini memberi, bukan meminta."

,

kali ini saya akan membahas cara
membuat menu Slide Out di Navigator
caranya agak sedikit rumit sih tapi
kalau sudah jadi pasyi bagus kok kaya
punya saya... langsung aja yu Lets Goo.....!!!





1.Masuk ke blogger


2. lalu klik rancangan lalu klik Edit HTML lalu cari code ]]></b:skin> Cari dengan F3 atau CTRL+F


3.Copy Script Di bawah ini lalu Paste di atas code ]]></b:skin>

/*----------------
Beautiful Slide Out Navigation
-------------------------------*/
.headerfixed
{
width:600px;
height:56px;
position:absolute;
top:50%;
left:10px;
background:#fff url(title.png) no-repeat top left;
}
ul#navixed {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 10px;
list-style: none;
z-index:999999;
width:721px;
}
ul#navixed li {
width: 103px;
display:inline;
float:left;
}
ul#navixed li a {
display: block;
float:left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color:#000;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #BDDCEF;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
ul#navixed li a:hover{
background-color:#000;
}
ul#navixed li a span{
letter-spacing:2px;
font-size:11px;
color:#FFF;

}
ul#navixed .home a{
background-image: url(http://3.bp.blogspot.com/-aXrFVyf4QsA/TZBebt8Z8jI/AAAAAAAAAgY/wHMKwyDH86g/s1600/home.png);
}
ul#navixed .about a {
background-image: url(http://4.bp.blogspot.com/-U0VzmKiVx3k/TZBeclR4x5I/AAAAAAAAAgc/c6T4Q-__HTw/s1600/id_card.png);
}
ul#navixed .twitter a {
background-image: url(http://2.bp.blogspot.com/-84f0jEeeffc/TZBehJq90AI/AAAAAAAAAgs/w4UaF1VPgLs/s1600/search.png);
}
ul#navixed .facebook a {
background-image: url(http://3.bp.blogspot.com/-E6iRDAxuTWg/TgcWoi1nWII/AAAAAAAAAsY/j1GiBwqkP44/s1600/facebook.png);
}
ul#navixed .login a {
background-image: url(http://1.bp.blogspot.com/-QVr2_NSQylI/TgeHiL9tB3I/AAAAAAAAAsc/91-CRVpGowQ/s1600/Login.png);
}






 4  .kemudian cari Code </head> lalu letakan script dibawah ini di atas code </head>


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'/>
<script src='http://kangdadang.googlecode.com/files/jcolor.js'/><script type='text/javascript'>
$(function() {
var d=300;
$(&#39;#navixed a&#39;).each(function(){
$(this).stop().animate({
&#39;marginTop&#39;:&#39;-80px&#39;
},d+=150);
});

$(&#39;#navixed &gt; li&#39;).hover(
function () {
$(&#39;a&#39;,$(this)).stop().animate({
&#39;marginTop&#39;:&#39;-2px&#39;
},200);
},
function () {
$(&#39;a&#39;,$(this)).stop().animate({
&#39;marginTop&#39;:&#39;-80px&#39;
},200);
}
);
});
</script>



5.dan langkah terakhir cari code </body> copy script di bawah ini lalu paste di atas </body>


<ul id='navixed'>
<li class='home'><a href='#'><span>Home</span></a></li>
<li class='about'><a href='#'><span>About</span></a></li>
<li class='search'><a href='#'><span>Search</span></a></li>
<li class='photos'><a href='#'><span>Photos</span></a></li>
<li class='rssfeed'><a href='#'><span>Rss Feed</span></a></li>
<li class='podcasts'><a href='#'><span>Podcasts</span></a></li>
<li class='contact'><a href='#'><span>Contact</span></a></li>
</ul>


ganti tanda # dengan url anda 

One Response so far.

  1. CTZN says:

    mana? kok gaada?
    :o

Leave a Reply