Cara Membuat Popup Gambar di Tengah Blog atau Website

Inspirasi sukses , Halo sobat inspiratif kali ini saya akan berbagi ilmu masih tentang Tutorial Blogger , " Cara Membuat Popup Gambar di Tengah Blog atau Website " . Ini juga dapat sobat gunakan dalam menyambut NKRI ke 70 seperti pada gambar berikut ini

Cara Membuat Popup Gambar di Tengah Blog atau Website

Lalu bagaimana cara untuk memulainya ?? cukup mudah dan amat sangat teramat mudah
Berikut

Buka Blogger sobat
Klik Tata Letak
Klik Tambahkan Gadget
Klik HTML/Java script

Masukkan script di bawah ini

<div><style type="text/css">
#topbar{
position:absolute;
padding-left:30%;padding-top:10%;
background-color: transparancy;
width: auto;heigth:auto;
visibility: hidden;
z-index: 100;
}
</style> <script type="text/javascript">
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 = 30 //set x offset of bar in pixels
var startY = 5 //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()", 10);
}
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>
<div class="clear">
</div>
<div id="topbar">
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikcJxxomVl_m2u6P2A6NP_PYk78wyTZSuBmEtauxryu7YBzvL3DKGqH3S0kucpAN-25b4tSJSDnY9Hh6jSeLIH2WH_NrnrmhVOujvUPqHdgKBOt7qAdC_5b9i8fb-VFf8_C3KFTm7nUQvk/s1600/close3.png" alt="close"/></a></div>
<center><div style="text-align: center;">
&nbsp;Inspirasisukses.com<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="#" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="365" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguIX0kLeGi-NyC1xTk_BDStryPRe3O4U99wMnoYWvgvRz0NL-ha8DyBRccNMa1ewRXJxLIyPBPJosR0Pa_RwUeXiJqBmW6znxMMIl8hQEiOAxoPOt2LRMt42q8gs9AnQXijgZfeJ94qFQ/s1600/sukseso.png" width="490" /></a></div>
</div></center></div></div>

Sebelum Save pastikan Sobat telah ubah warna warna di atas

Warna Biru : adalah teks sobat dapat merubah tulisannya

Warna Hijau : adalah ketika gambar di klik maka url akan tertuju pada url tersebut . Diatas saya beri tanda # berarti saya ingin ketika gambar di klik tidak direct ke url lain

Warna Merah url bisa berisi gambar , video youtube , fanspage like dll .

Warna Kuning adalah ukuran yang dapat sobat sesuaikan panjang dan lebarnya

Ketika sobat telah sukses editing save dan publikasikan lalu lihat penampakannya

Demikian informasi unik tentang  Cara Membuat Popup Gambar di Tengah Blog atau Website. Semoga dapat menjadi inspirasi bagi sobat. Salam Sukses !!

Note : Apabila sobat melihat artikel dan tidak dapat mengcopy sobat dapat tinggalkan komentar untuk saya bantu