Saturday, June 07, 2014

Tutorial : Slide Your Widget


image Copy semua code dalam box di bawah
image Paste dalam HTML/Javascript
image Save dan lihat hasilnya! image
<style>
#oneout {
Position:fixed;
Top:64px;left:0px;
Text-align:center;
-webkit-transition-duration:0.3s;-moz-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;
Z-index:99999999; }
#oneout_inner {
border: 1px dashed #ddd;
Position:fixed;
Width:200px; height:auto;
Top:40px; left:-270px;
Padding:3px;
Background:#FFFFFF;
-webkit-transition-duration:0.3s;-moz-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;
Text-align:center;
Z-index:99999999; }
#oneout:hover {
Left:250px;
Z-index:99999999; }
#oneout:hover #oneout_inner {
Left:0px;z-index:99999999; }
.onetitle {
Position:fixed; left:0px; bottom:90px;
Font-family:arial; font-size:16px;
-webkit-transform:rotate(-90deg); -moz-transform:rotate(-90deg); -ms-transform:rotate(-90deg); -o-transform:rotate(-90deg); transform:rotate(-90deg); z-index:99999999; }
</style>
<!-- made by msermzni.blogspot.com-->
<div id="oneout"><span class="onetitle">
THE OWNER
</span><div id="oneout_inner"><center>
Put your stuff here.
<br /></center></div></div>

No comments: