Membuat Secret Box #2


Haloooo halooo !! nei, kok pagi-pagi udah ngepost? kamu enggak masuk ya? Bukan. karena hari ini sampe besok kamis kelas 6 TRY OUT jadi kelas 5 masuk jam 10.00 pagi. Oke, sekarang aku mau membahas secret box! seperti gambar di atas




  • Login ke blogger >> dasbor
  • Tata Letak >> tambah gadget >> html / javascript
  • Then, copy code ini

<style>
.adv2 ul{background:url(http://37.media.tumblr.com/ab6fae6efe0134f8829013acaf10a99e/tumblr_movdbcThVO1ru3nbdo5_250.png);padding:5px;border:1px dashed #DDDDDD;text-align:center;width:200px;color:#555}
.adv2 p{padding:5px;text-align:left;width:250px;color:#555;}
a.tablo{-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
cursor:pointer;background:#fff;
width:20px;
text-decoration:none;
border:1px dashed #ffeeee;
color:#555;
display:inline-block;
text-align:center;
}
a.tablo:hover{
-webkit-transition-duration: 0.5s; 
box-shadow:inset 0px 13px 0px #FFEEEE,inset 0px -13px 0px #ffdede; color: #fff;
}
 </style>
<div id="adv2" class="adv2">
<center><style>
.neira{background:url(URL BG
);padding:5px;border:3px solid #000;text-align:center;width:300px;color:#555}
a.tablo{
border:1px dashed mistyrose; 
background:#aaa;
text-decoration:none;
color:#000;
padding:5px;
font:12px 'short stack';
letter-spacing:1px;
margin-left:2px;
margin-right:2px;
-webkit-transition:All 0.4s ease;
-moz-transition:All 0.4s ease;
-o-transition:All 0.4s ease;
display:inline-block;
width:49px;
}
a.tablo:hover{
-webkit-transition-duration: 0.5s; 
box-shadow:inset 0px 13px 0px #999,inset 0px -13px 0px #ffdede; color: #fff;
}
#wnsb img{max-width:245px;}
 </style>
<div class="neira">
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('1').innerHTML" >S</a>
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('2').innerHTML" >T</a>
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('3').innerHTML" >A</a>
<a class="tablo" onclick="document.getElementById('wnsb').innerHTML=document.getElementById('4').innerHTML" >R</a> </div>
<div id="wnsb" style="width:300px;color:#ccc; padding:5px;border:3px solid #000;border-top:none;font:10px SHORT STACK; background:url(URL BACKGROUND);letter-spacing:0px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;">
Ciao, amici! delete this word, and add your word in here!
<br /><img style="width:180px;height:150px; margin-top: 5px;border-radius: 10px; box-shadow: 0px 0px 0px 0px #ffeded;" src='URL IMAGE SECRET BOX'/>
<br />
</div>
<div id="1" style="display: none;">
first your code
<div id="2" style="display: none;">
KODE KEDUA / SECOND KODE
<div id="3" style="display: none;">
kode ketiga
<div id="4" style="display: none;">
KODE KEEMPAT. ADA TAK?
<center></center></div></center></div>

  • Paste di bagian kotak script nya. Eh, iya! sebelumnya di edit-edit dulu yaak bisa di sini
  • Save kalo udah beres semua!

3 comments:

1 ) Berikan komentar yang baik

2 ) Jangan pernah berkata kasar, jorok, dan menyakiti perasaan orang lain

3 ) Jangan sampai bikin gaduh di kotak comment

4 ) Blog ini secara otomatis memilah mana yang komen spam (termasuk yang menawarkan produk-produk seperti produk diet, dll). Jadi, hati-hati komennya

Related Posts Plugin for WordPress, Blogger...