1 STALKERS
DREAMER ;
FACEBOOK SHOP ASK.FM BLOGSKIN +FOLLOW
Tutorial Buat section 'KLIK ME'
Posted Aug 17, 2013 // 1:10 AM


Tutorial ni khas untuk Ken (cewah) --" Act tutorial ni dah lama nak buat tapi macam entahlah, arina buang lah link blog yang buat tuto ni sebelum ni. Tiba2 Ken kita pulak tanya macam mana nak buat .. takpelah arina cari balik lah code tu dalam templete .. k tuja , kekekekeke

  Dashboard > Templete
  Search code ni </style>
  Paste code dibawah ni kat bawah code </style> tadi 

<style type="text/css">
#at{
position:fixed;
right:350px;
z-index:+1000;
top:6;
}
* html #at{position:relative;}
.attab{
height:500px;
width:30px;
float:right;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
background:url(URL GAMBAR 1)
no-repeat 0 0 transparent;
width:800px;
height:700px;center pop-up ;
padding:100px 0 20px 5px;
}
</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>
<br />
<div id="at">
<div class="attab" onclick="showHideAT()">
</div>
<div class="atcontent">
<div align="center">
<div style="background: url() no-repeat;">
<center>
<div id="author">
<a href="javascript:void(0);" onclick="showHideAT()">
</a></div>
</center>
</div>
<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-500-at.offsetWidth).toString() + "px";
</script>
<style type="text/css">
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;F
opacity: 0.5;
-khtml-opacity: 0.5;}
a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>
<br />
<div style="display: scroll; position: fixed; right: 2px; top: 14px;">
<a href="javascript:void(0);" onclick="showHideAT()">
<img alt="PUSH" src="URL GAMBAR 2" title="KLIK ME" /></a>
</div>
</div>
</div>
</div>

  Preview & Save

Merah : Url gambar 1 ( untuk yang besar tu ) < nama x official langsung XD
Hijau : Url gambar 2 ( untuk 'Klik Me' tu)

K done :)
0 Comments:

Post a Comment

1# Harsh word not allowed
2# Support word , I say THANKS ^^

... Back to the blog?