Most codes available to add popup to blog feeds, facebook fan page etc.. comes with jQuery there is the problem, because when the blog has already had jQuery what the blog does not work. In this tutorial I will be teaching you how to add a popup with a Facebook page to enjoy in blogs or sites that already have jQuery. What I teach is the same that we use in Tips and Computer Games.
This popup you can see in the image just above only loads once per session, ie, whether a person enters your blog to see other pages, but it will not appear and will only appear if you close the blog and open it again.
To add jQuery popup without follow the steps below:
1 - Enter the HTML on your blog "Design" and press Ctrl + f and search for </ head> above it and paste the following codes:
<style>
# Topbar {
position: absolute;
border: 2px solid green;
padding: 5px 0px 0px 0px;
margin: 0px 0px 100px 200px;
background-color: # ffffff;
font-size: 12px;
width: 400px;
visibility: hidden;
z-index: 400;}
</ Style>
Editing this code:
width: the width place. The height is automatic.
bolder: The border width and color of it
margin: the first and last (100px and 200px) change the values to change the location of the popup in blog
2 - Now on down the line </ head> paste the code below:
<- Java PopUp start ->
<script type="text/javascript">
var = 1 persistclose
var startx = 20
var = 5 StartY
var verticalpos = "fromtop"
iecompattest function () {
return (document.compatMode document.compatMode &&! = "BackCompat")? document.documentElement: document.body
}
get_cookie function (name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length> 0) {
offset = document.cookie.indexOf (search)
if (Offset! = -1) {
offset + = search.length
document.cookie.indexOf end = ("", offset);
if (end == -1) end = document.cookie.length;
returnvalue = unescape (document.cookie.substring (offset, end))
}
}
return returnvalue;
}
closebar function () {
if (persistclose)
document.cookie = "remainclosed = 1"
document.getElementById ("topbar"). style.visibility = "hidden"
}
staticbar function () {
barHeight = document.getElementById ("topbar"). offsetHeight
ns = var (navigator.appName.indexOf ("Netscape")! = -1) | | window.opera;
var d = document;
ml function (id) {
var el = d.getElementById (id);
if (! persistclose | | && persistclose get_cookie ("remainclosed") == "")
el.style.visibility = "visible"
if (d.layers) el.style = l;
el.sP = function (x, y) = x + {this.style.left "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;
}
el return;
}
window.stayTopLeft = function () {
if (verticalpos == "fromtop") {
var ns = pY? pageYOffset: iecompattest (). scrollTop;
ftlObj.y = + (pY + StartY - ftlObj.y) / 8;
}
else {
var ns = pY? 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>
<- Java PopUp Final ->
3 - Search for the line <body> and paste the code below it:
<- PopUp Home contents ->
<div id='topbar'>
<p align='right'> <a href='' onClick='closebar(); return false'> [Close] </ a> </ p>
..... what you want to put in pop-up .....
</ Div>
<- Final PopUp content ->
At the writing ..... what you want to put in pop-up ..... you will put it to appear in the popup can be linked image, text and a box of facebook fans that you can do by clicking here .
