Jumpa lagi sobat blogger, lama jg gk buat artikel ni karena kesibukan dan maen poker heheheheehh...........
kali ini saya ingin berbagi dengan sobat blogger sedikit skrip mengenai cara memasang CCTV atau kamera di blog. Artikel ini saya dapat ketika saya mengunjungi salah satu blog ( namapanjang.blogspot.com ) dan sayapun mencoba mencicipi ilmux di blog saya yang lain ( kayak makanan aja maen cicip heheheh ....) alhasilnya blog saya jg kelihatan cool dengan skrip ini.
Oke langsung aja ke TKP daripada saya ngomong terus heheh.....
- Login ke Blogger
- Klik Rancangan
- Ke Elemen Laman
- Klik Tambahkan Gadget
- Pilih HTML/Javascript
- Selanjutnya sobat blogger masukan script yang ada di bawah ini lalu save
<center><a href="javascript:void(0);"onclick="showHideAT()"/><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAQUF7cwyc5DPVF11WkguWmR3RILyHAtSzNpJ0V63kgiu8kpkNmmnnvL8lLWjjXm3jP6KucGQ-YcS91Wc71FC_JUFrqzCc_Z1hb2oLy1mTv4r2lytdR9vGkoiVOYAKwCgWVao0Gm9MnNOU/s120/Hey+coy+%28+www.fake-buku.blogspot.com+%29+CCTV.gif" alt="cbox" title="Click | About Me" style="display:scroll;position: fixed; top:0px;right:0px;cursor:pointer;style=" opacity:1;filter:alpha(opacity="100)&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;quot;" onmouseover="this.style.opacity=1.0;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=1.0;this.filters.alpha.opacity=100" ;" height="90px" width="77px" /></a></center>
<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:1px solid #000000;
background:#000000 repeat-y center;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:9px;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url(http://3.bp.blogspot.com/_bBL9ze_JZsw/TT_XA8lKqMI/AAAAAAAAAM0/uiy-BP_zbN8/s1600/black25.png) no-repeat;">
<br/>
<br/>
<br/>
<center><a href="https://plus.google.com/118368137734252980147"><img border="0" title="My.Google" alt="My.Google" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUBNXmjAJaDySZ2tH5beSGhq3FUZsSw5i5ag84V8fM5EZM4CDmCgH3oScZPEKk5a4h6dBufVbUKd48k-DU4PEgg2R5fmZNlHyqI0jprvKvbtSZrLvoILdh3YfZk2TkM9zQZGPIerEL/s150/Hey+coy+%28+www.fake-buku.blogspot.com+%29+google_plus.png"/></a>
<a href="http://www.facebook.com/ogamankz"><img border="0" title="My.Facebook" alt="My.Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrVwhuaGBrGbOwvRsv5j3nRmkcRODv6mEUrkqvpp3K7J6px06RGLTWSX6uBuXxzEztmcJM4Vmh3sWAL4nno-8n1TL8oA604j-drlo1p0pkJMUrvEkopBwA8hO75IeUmu_ivpCvabPf/s150/Hey+coy+%28+www.fake-buku.blogspot.com+%29+inside-facebook.png"/></a>
<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:1px solid #000000;
background:#000000 repeat-y center;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:9px;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url(http://3.bp.blogspot.com/_bBL9ze_JZsw/TT_XA8lKqMI/AAAAAAAAAM0/uiy-BP_zbN8/s1600/black25.png) no-repeat;">
<br/>
<br/>
<br/>
<center><a href="https://plus.google.com/118368137734252980147"><img border="0" title="My.Google" alt="My.Google" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUBNXmjAJaDySZ2tH5beSGhq3FUZsSw5i5ag84V8fM5EZM4CDmCgH3oScZPEKk5a4h6dBufVbUKd48k-DU4PEgg2R5fmZNlHyqI0jprvKvbtSZrLvoILdh3YfZk2TkM9zQZGPIerEL/s150/Hey+coy+%28+www.fake-buku.blogspot.com+%29+google_plus.png"/></a>
<a href="http://www.facebook.com/ogamankz"><img border="0" title="My.Facebook" alt="My.Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrVwhuaGBrGbOwvRsv5j3nRmkcRODv6mEUrkqvpp3K7J6px06RGLTWSX6uBuXxzEztmcJM4Vmh3sWAL4nno-8n1TL8oA604j-drlo1p0pkJMUrvEkopBwA8hO75IeUmu_ivpCvabPf/s150/Hey+coy+%28+www.fake-buku.blogspot.com+%29+inside-facebook.png"/></a>
<a href="http://www.twitter.com/onco_gamankz"><img border="0" title="My.Twitter" alt="My.Twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTlut5a-e1t-va27SzAtmz6Rf0KtpvfisuTJiUb8_qUOyee9fYqNLr53S60EJCt36jZN24UQ1D2ZoKYVoTW7x-kIetnoQYByiO0t7pcYnuub2q1vJUlA_eEcp1Djv2WDnXc4JOyoJL/s150/Hey+coy+%28+www.fake-buku.blogspot.com+%29+glossy-Twitter.png"/>
</a></center>
<br/>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script></div></div></div></div>
</a></center>
<br/>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script></div></div></div></div>
Catatan : Kode yang berwarna hijau anda ganti dengan URL anda sendiri
Editor by onco gamankz
Posting Komentar