Energy
saving blog bisa dikatakan sebagai screen saver pada blog, karena blog
akan tertutup warna hitam disaat kita mencoba membuka halaman lain,
atau tidak aktif pada blog tersebut. Warna hitam yang menutupi akan
hilang bila kita mengarahkan mouse pada halaman blog tersebut…. Seperti
blog saya ini. Mau tahu caranya ?????
Cara Pertama
- Loggin dulu ah ke blog sobat-sobat
- Masuk ke Rancangan > Edit HTML
- Cari kode <head>
- Lalu Copas Kode Javascript di bawah ini tepat diatas kode diatas :
<!-- save your energy -->
<script language='javascript'
src='http://www.onlineleaf.com/savetheenvironment.js'
type='text/javascript'></script> <!-- save your energy end -->
Cara Kedua
- Login ke blogger
- Dari dasbor klik rancangan
- kemudian klik "Tambah Gadget/ HTML/JavaScript"
- Lalu copaskan script di bawah ini :
<style type="text/css"> /* original code by: cvraseac.blogspot.com - _CaesarVraseaC_ - Oct 2010 */
body .saving{position: fixed;width: 100%;top: 0;left:0;height:
100%;opacity: 0.98;filter:
alpha(opacity=98);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";background:
#000;border-bottom: 3px solid transparent;z-index:
999999;-o-transition: all 3s ease-in-out 10s;-moz-transition: all 3s
ease-in-out 10s;-webkit-transition: all 3s ease-in-out 10s;}body:hover
.saving {opacity: 0.0;height:0.001%;filter: alpha(opacity=0);-ms-filter:
"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";background:
#2a0236;border-bottom: 5px solid #333;-o-transition: opacity 2s
ease-in-out 2.5s, background-color 3s linear 0.5s, height 1s ease-in
1.8s;-moz-transition: opacity 2s ease-in-out 2.5s, background 3s linear
0.5s, height 1s ease-in 1.8s;-webkit-transition: opacity 2s ease-in-out
2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;}body .saving
p.esm1{margin: 0;padding: 0;width: 92%;background:
transparent;font-size: 50px;font-family: "Serif", Rooster;color:
#333;text-shadow: 1px 1px 2px #ccc;position: relative;margin-top:
200px;line-height: 20px;font-weight: bold;text-align: center;border:
30px solid transparent;border-radius: 20px;-moz-border-radius:
20px;-webkit-border-radius: 20px;-o-transition: -o-transform 5s ease-out
8s, background-color 4s ease-out 12s;-moz-transition: -moz-transform 5s
ease-out 8s, background 4s ease-out 12s;-webkit-transition:
-webkit-transform 5s ease-out 8s, background 4s ease-out 12s;}/*
original code by: cvraseac.blogspot.com - _CaesarVraseaC - Oct 2010
*/body:hover .saving p.esm1{font-size: 10px;color: red;width:
25%;margin: 340px 0 0 300px;padding: 25px;background: #aaa;border: 20px
solid #888;border-radius: 170px;-moz-border-radius:
170px;-webkit-border-radius: 170px;-o-transform:translate(600px,-500px)
rotate(360deg) scale(0.2);-moz-transform:translate(600px,-500px)
rotate(360deg) scale(0.2);-webkit-transform:translate(600px,-500px)
rotate(360deg) scale(0.2);-o-transition: font 1.1s 0.1s, width 1.3s
0.4s, margin-left 0.8s 1.2s, -o-transform 1.2s linear 1.5s,
background-color 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border
3s ease-in;-moz-transition: font 1.1s 0.1s, width 1.3s 0.4s,
margin-left 0.8s 1.2s, -moz-transform 1.2s linear 1.5s, background 0.6s
ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s
ease-in;-webkit-transition: font 1.1s 0.1s, width 1.7s 0s, margin-left
0.8s 1.2s, -webkit-transform 1.2s linear 1.5s, background 0.6s ease-in
0.6s, margin-top 1s ease-in 0.5s, border 3s ease-in,
-webkit-border-radius 3s ease-in;}.saving p span.esm2{font-size:
18px;opacity: 0.5;filter:
alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";display:
block;text-align: center;width: 300px;margin: -10px auto; font-weight:
normal;padding: 2px 8px;background: #000;border: 1px solid
#333;border-radius: 0;-moz-border-radius: 0;-webkit-border-radius:
0;color: #0000FF;text-shadow: none;font-family: Arial, Helvetica,
sans-serif;-o-transition: 1s ease-out;-moz-transition: 1s
ease-out;-webkit-transition: 1s ease-out;}.saving:hover p
span.esm2{font-size: 10px;width: 200px;padding: 0;}/* original code by:
cvraseac.blogspot.com - _CaesarVraseaC_ - Oct 2010 */.saving p
span.esm3{color: #ccc;font-family: "Tahoma", Arial, Helvetica;display:
block;margin:10px auto;background: url
http://i964.photobucket.com/albums/ae124...) left center
repeat-x;background: -moz-linear-gradient(top,#666,#111);background:
-webkit-gradient(linear,0% top,0% bottom,from(#111),to(#666));opacity:
0.6;filter:
alpha(opacity=60);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";width:
250px;text-shadow: 1px 1px 1px #000;border: 1px solid
#333;border-radius: 4px;padding:2px 10px;-moz-border-radius:
4px;-webkit-border-radius: 4px;font-size: 12px;font-weight:
normal;line-height: 16px;}.saving .by_CaesarVraseaC_ {margin-left:
30px;text-align: left;color: #015828;font-size: 12px;font-weight:
normal;position: absolute;top: 550px;width: 100%;height: 20px;left:
0;}/* original code by: cvraseac.blogspot.com - _CaesarVraseaC_ - Oct
2010 */.saving .by_CaesarVraseaC_ span.esm4 {color:
#aaa;font-style:italic;font-size:14px;font-weight:bold;text-transform:uppercase;}#recpost
{width:210px;overflow: hidden;height: 327px;float: right;margin-top:
10px;padding: 4px 2px;background: transparent;border: 1px solid
transparent;border-radius: 10px;-moz-border-radius:
10px;-webkit-border-radius: 10px;-o-transition: all 1.5s
ease-out;-moz-transition: all 1.5s ease-out;-webkit-transition: all 1.5s
ease-out;} </style> <div class='saving'> <p class='esm1'>* K H O C E T B L O G *<br/> <span class='esm2'></span><br/><br/> <span class='esm3'><br/>** BLOG KHOCET KANAK SASAK **</span></p> <div class='by_KHOCET_'><span class='esm4'></span></div> </div>
Catatan :
Nama Blog atau warna yang ada pada kode tersebut bisa diubah sesuai keinginan anda sendiri.
SEkian dulu perjumpaan kita...sampe ketemu lagi di tutorial blognya yaa...jody world gitulohh hahay
Title : Membuat Energy Saving/ Screen Saver Di Blog
Description : E nergy saving blog bisa dikatakan sebagai screen saver pada blog, karena blog akan tertutup warna hitam disaat kita mencoba membuka hal...