apa bedanya dengan trik yang asli?
trik yang saya modif ini,diterapkan untuk blog sebagai welcome screen/splash screen.jadi fungsi slide'a menjadi tombol/menu pembuka/opening blog kita.
saya juga menambahkan z-index:9999 dan seterusnya,agar posisi objek ada di layer paling atas/tertinggi dari semua element dibelakangnya
$(function() {
$("h2 img").draggable({
axis: 'x',
containment: 'parent',
drag: function(event, ui) {
if (ui.position.left > 550) {
$("#well").fadeOut();
}
},
stop: function(event, ui) {
if (ui.position.left < 551) { $(this).animate({ left: 0 }) } } }); });
#well h2 {
background: -moz-linear-gradient(left, #8B836F, 0.4, #8B836F, 0.5, #52CFD2, 0.6, #8B836F, #8B836F);
background: -webkit-gradient(linear,left top,right top,color-stop(0, #8B836F),color-stop(0.4, #8B836F),color-stop(0.5, #52CFD2),color-stop(0.6, #8B836F),color-stop(1, #8B836F));
-moz-background-clip: text;
-webkit-background-clip: text;
border-radius: 15px;
-moz-text-fill-color: transparent;
-webkit-text-fill-color: transparent;
-webkit-animation: slidetounlock 5s infinite;
border: 1px solid #FEA21D;
font-size: 80px;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
margin-top: 130px;
padding: 0;
width: 720px;
-webkit-text-size-adjust: none;
}
#well {
padding: 140px 20px 20px 300px;
background:#000;
overflow: hidden;
width:100%;height:100%;
position:fixed;
z-index:9999999999999999;
-webkit-user-select: none;
font-family: 'Open Sans', sans-serif;
}
#well h2 {
background: -moz-linear-gradient(left, #8B836F, 0.4, #8B836F, 0.5, #52CFD2, 0.6, #8B836F, #8B836F);
background: -webkit-gradient(linear,left top,right top,color-stop(0, #8B836F),color-stop(0.4, #8B836F),color-stop(0.5, #52CFD2),color-stop(0.6, #8B836F),color-stop(1, #8B836F));
-moz-background-clip: text;
-webkit-background-clip: text;
border-radius: 15px;
-moz-text-fill-color: transparent;
-webkit-text-fill-color: transparent;
-webkit-animation: slidetounlock 5s infinite;
border: 1px solid #FEA21D;
font-size: 80px;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
margin-top: 130px;
padding: 0;
width: 720px;
-webkit-text-size-adjust: none;
}
#slider {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirvGImC2CfE71tWiipj4re9VNq0JaNx_ZNyg9vP4ppe9hRPOholAHIint_sIfQEN5LZVrCRxEIeMot8bItLhyphenhyphen0NArBMMxIpiYPF-4Qd_oMFSR9t_J92pBe6z6xiqG7QOzKzeXMXkFR7yk/s1600/arrow.png) no-repeat;
width: 146px;
height: 98px;
display: inline-block;
vertical-align: middle;
line-height: 1;
opacity:0.8;
}
#slider:hover {opacity:1;}
@-webkit-keyframes slidetounlock {
0% {
background-position: -720px 0;
}
100%{
background-position: 720px 0;
}
}
.bgslide {background:#000;width: 722px;
border-radius: 15px;}
<div id='well'>
<div class='bgslide'><h2><strong id='slider'/> <span>slide to unlock</span></h2></div></div>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js'/>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js'/>
<script src='http://css-tricks.com/examples/SlideToUnlock/js/slidetounlock.js'/>
saya agak malas reupload js'a~xD
bila merasa hosting'a terasa agak lelet,tinggal download dan re-upload js'a di sites.google.com
#note
-letakan CSS di atas kode ]]></b:skin>
-letakan HTML didalam/dibawah kode <body>
-letakan jquery diatas kode </head>
http://css-tricks.com/examples/SlideToUnlock/
http://sword-art-online-blogger-template.blogspot.com/
/* Arnoldi-Technology CSS Read More */Nah Nanti Silahkan Di edit Sendiri lagi y :D
.rmlink{float:right;font-family:Baumans,cursive;background:#000001;font-size:15px;color:white;font-weight:bold;position:absolute;width:578px;height:1px;border:3px solid #fff;border-radius:5px;box-shadow:2px 2px 2px #000, 2px 1px -1px #000;text-align:center;line-height:50px;text-shadow:1px 1px 2px #222;opacity:.0;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out}.rmlink:hover{opacity:1.0;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;width:683px;height:50px}.rmlink a{color:#c1c1c4;margin-top:5px}
.crop{width:100px;height:50px;overflow:hidden;border:1px solid #666;border-radius:9px;}
.posting{height:120px;color:#000;text-shadow:0 0 1px white;text-align:justify;border-image:initial;width:230px;float:left;font-size:13px;display:none;margin:5px 15px 0 0;padding:5px;}
.jump-link a{background:#f2f2f2;color:#000000;position:relative;display:none;margin-top:-10px;padding:3px 10px;}
| Alexa Traffic Rank | Reputation | ||
|---|---|---|---|
 1,062,707
Global Rank
 |  6,383
Rank in ID
|
Sites Linking In
|
1 Review
|
RAR registration data
GoDesain
Unlimited Company License
UID=85809e6a0fde94d8fa95
6412212250fa95dc80957d3b78af9245c62d98787c33099debe20a
4d39faf3beaeaf7ba62060fce6cb5ffde62890079861be57638717
7131ced835ed65cc743d9777f2ea71a8e32c7e593cf66794343565
b41bcf56929486b8bcdac33d50ecf77399600ffeefe7a2041d7fe7
9f06594bd79c285c2c19d7d9a786d95f8a05e6141248ddb9d9830f
6977c3aab5c4e4e651e4813323e9eb20ac3fd8b7173262fc601959
515d0a89683aae2654bfd31328af3e331535ea2d85dc1402723610
http://www.backlinkgenerator.net/
http://users5.nofeehost.com/backlinkgenerator/
Cara Daftar :1. JOIN disana2. Isi data3. confirm di email4. selesai
Cara Menggunakannya :1. Login Dulu di Facebook agan .2. Buka http://www.ninjasaga.com3. Klik "Buy Token"4. Pilihlah yang 80T .5. Pilih metode pay nya "Ultimitepay".6.nah setelah itu , klik "BUY"7. isikan user dan pasword agan di Ultimitepay tadi .8. kemudian pilih "Apply My UltimitePay"9. selesai10. cek Ninjasaga klian .
Note : 1 Akun Facebook Hanya Bisa 1 Akun Ultimate Pay
