Monday, 24 June 2013

Membuat Menu Klik Kanan Di Blog

Membuat Menu Klik Kanan Di Blog
Right Click Menu - Fungsi dari script ini adalah mematikan fungsi klik kanan pada blog dengan gambar, Namun saya mengubah fungsi dari anti klik kanan tersebut menjadi "Menu Navigasi" yang hampir menyerupai menu yang ada pada windows 8.
"Menu Navigasi" ini akan muncul apabila seseorang meng-klik kanan pada blog dan menu ini dilengkapi dengan tombol close yang ada dipojok.

Berikut Cara pemasangannya :
1. Tambahkan kode css dibawah ini diatas kode  ]]></b:skin>
 nav {background:#333;box-shadow:0 1px 0 rgba(0, 0, 0, 0.4) inset, 0 2px 0 rgba(255, 255, 255, 0.2) inset, 0 1px 3px rgba(0, 0, 0, 0.2);height:50px;overflow:hidden;position:relative;text-align:left;}
nav a {color:#eee !important;text-shadow:1px 1px #222222;display:block;text-decoration:none;line-height:50px;padding:0 10px;box-shadow:1px 0 0 rgba(255, 255, 255, 0.1) inset, -1px 0 0 rgba(0, 0, 0, 0.1) inset}
nav a:hover {color:#fff !important;text-decoration:none!important;text-shadow:0 0 2px #fff;}
nav li {display:inline;float:left;}
nav li a {font-family:'Agency FB';letter-spacing:1px;font-weight:bold;font-size:15px;}
.overlay {box-shadow:0 0 4px #222;background:#333; position:fixed !important;height:50px; bottom:0px; left:0px; right:0px;border-top: 2px solid #DDD;z-index: 100;}
.tutup {border: 4px solid #555;border-radius:40px;cursor: pointer;float: right;height: 20px;margin: 12px; width: 20px;position: relative;}
.tutup:before {font-family: FontAwesome;font-weight: normal;font-style: normal;text-decoration: inherit;position: absolute;color: #EEE;font-size: 16px;top: 1px;left: 3.5px;content: "\f00d";} 
2. Dan tambahkan kode ini diatas code </body>
<script src='https://first-secondary.googlecode.com/svn/trunk/lainnya/rightclickmenu.js' type='text/javascript'/>
<div class='overlay' id='overlay' style='display:none;'><a class='tutup' id='tutup'/><div class='waone' id='waone'>
<nav><ul>
<li><a href='http://maz-waone.blogspot.com'><i class='icon-home'/> Beranda</a></li>
<li><a href='/p/sitemap.html'><i class='icon-file-alt'/> Daftar Isi</a></li>
<li><a href='/search/label/Blogspot'><i class='icon-folder-close'/> Blogspot</a></li>
<li><a href='/search/label/Photoshop'><i class='icon-edit'/> Photoshop</a></li>
<li><a href='/search/label/Tips%20Trik'><i class='icon-desktop'/> Tips Trik</a></li>
<li><a href='/p/tukaran-link-blog.html'><i class='icon-link'/> Tukaran Link</a></li>
</ul></nav>
</div></div>
3. Pratinjau terlebih dahulu, Jika tidak terjadi error klik SAVE.

No comments:

Post a Comment