Jumat, 28 September 2012

You are here : Home » Ketagihan Javascript, TOP WIDGET 2 » Pasang Widget Melayang di Postingan Tertentu

Pasang Widget Melayang di Postingan Tertentu

widget melayang

Bosan dengan widget melayang itu-itu saja yang selalu muncul di seluruh halaman ??

Di halaman berjudul "baca 1" widget melayangnya sama dengan widget melayang yang ada di halaman berjudul "baca 2". Begitu juga di halaman "baca 3", widget melayangnya itu lagi, itu lagi.

Mengapa tidak membuat widget melayang yang berbeda saja ?? Jadi, masing-masing postingan terdapat widget melayang nya masing-masing.

Agan tinggal salin kode berikut ini, tetapi ingat jangan mengedit kode yang bukan warna merah. Hanya kode yang warna merah saja yang bisa di edit.

<style type="text/css">

#topbar{
position:absolute;
border: 1px solid black;
padding: 1px;
background-color: lightyellow;
width:
380px;
visibility: hidden;
z-index: 100;
}

</style>


<script type="text/javascript">

/***********************************************
* Floating Top Bar script-
* Sliding routine by Roy Whittle
* This notice must stay intact for legal use.
* Visit http://ketagihanbaca.blogspot.com/ for full source code
***********************************************/

var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 70 //set x offset of bar in pixels
var startY = 15 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}

function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}

function staticbar(){
 barheight=document.getElementById("topbar").offsetHeight
 var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
 var d = document;
 function ml(id){
  var el=d.getElementById(id);
  if (!persistclose || persistclose && get_cookie("remainclosed")=="")
  el.style.visibility="visible"
  if(d.layers)el.style=el;
  el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
  el.x = startX;
  if (verticalpos=="fromtop")
  el.y = startY;
  else{
  el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
  el.y -= startY;
  }
  return el;
 }
 window.stayTopLeft=function(){
  if (verticalpos=="fromtop"){
  var pY = ns ? pageYOffset : iecompattest().scrollTop;
  ftlObj.y += (pY + startY - ftlObj.y)/8;
  }
  else{
  var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
  ftlObj.y += (pY - startY - ftlObj.y)/8;
  }
  ftlObj.sP(ftlObj.x, ftlObj.y);
  setTimeout("stayTopLeft()", 30);
 }
 ftlObj = ml("topbar");
 stayTopLeft();
}

if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<br />
<div id="topbar">
<a href="" onclick="closebar(); return false"><img src="http://www.cityandfinancial.com/shop/img/icon_close.png" border="0" /></a>

MASUKKAN KONTEN DI SINI
</div>

Ganti lah angka 380 untuk menyesuaikan lebar.
Ganti teks MASUKKAN KONTEN DI SINI itu dengan konten milik Agan.

Letak pemasangannya adalah di dalam postingan, tepatnya di tool "HTML" (sebelah Compose). Lakukan cara yang sama jika Agan ingin menerapkan di postingan lainnya.

Selamat mencoba.

17 komentar:

  1. widget melayang cocok gak yah sama blog ane yang sederhana gan?..

    BalasHapus
  2. pengen juga pasang di blog ane sob, tapi blog dah berat loadingnya.. thanks infonya

    BalasHapus
    Balasan
    1. Pasang aja Gan di 1 atau 2 halaman ter-spesial. Untuk menarik perhatian pengunjung aja :D

      Hapus
  3. Kapan2 boleh aku ya sob, kayaknya tambah keren kalo ada widget melayangnya hehehee... :)

    BalasHapus
    Balasan
    1. Silahkan Gan pasang di halaman mana saja dgn widget apa saja :)

      Hapus
  4. visiting u, what a nice blog :)

    BalasHapus
  5. Dulu ane pernah pake widget melayang.. tapi ane hapus karena alasan tertentu :-D

    BalasHapus
    Balasan
    1. Pasang aja di salah satu artikel Gan, jangan di semua halaman :)

      Hapus
  6. Tips yang bagus banget Gan...
    perlu di coba nich....

    BalasHapus
  7. Lucu juga.. melayang2 apa gak jatoh tuh :D

    BalasHapus