PDA

View Full Version : Floating Top Bar script



WEBstar
12-21-2009, 07:26 PM
1) Script Title: Floating Top Bar script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/floatbar.htm

3) Describe problem: Can someone tell me how to set cookie for 1 day?
what to edit? thanks!!

jscheuer1
12-22-2009, 06:10 PM
Use this version of the script:


<script type="text/javascript">

/***********************************************
* Floating Top Bar script- Dynamic Drive (www.dynamicdrive.com)
* Sliding routine by Roy Whittle (http://www.javascript-fx.com/)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var persistclose = 1 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session or daysOff
var daysOff = 1 //set days persistence for close, use null for session only
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
}

var cookie = {
set: function(n, v, d){ // cookie.set takes (name, value, optional_persist_days) - defaults to session if no days specified
if(d){var dt = new Date();
dt.setDate(dt.getDate() + d);
d = '; expires=' + dt.toGMTString();}
document.cookie = n + '=' + escape(v) + (d || '') + '; path=/';
},
get: function(n){ // cookie.get takes (name)
var c = document.cookie.match('(^|;)\x20*' + n + '=([^;]*)');
return c? unescape(c[2]) : null;
},
kill: function(n){ // cookie.kill takes (name)
cookie.set(n, '', -1);
}
};

function closebar(){
if (persistclose)
cookie.set('remainclosed', '1', daysOff);
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 || !cookie.get('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>

WEBstar
12-22-2009, 11:00 PM
i put your javascript..

but when i insert this code in body..


<div id="topbar">
<a href="" onClick="closebar(); return false"><img src="close.gif" border="0" /></a>
Your content here.
</div>

it won't work.. please help..:(

jscheuer1
12-23-2009, 03:12 AM
Works here, perhaps you forgot to include the styles. If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

WEBstar
12-23-2009, 12:23 PM
yes, i forgot style include..

i done everything you said.. but it's not working.. it's still there when i refresh page?!

:mad:

jscheuer1
12-23-2009, 02:27 PM
Please post a link to the page on your site that contains the problematic code so we can check it out.

WEBstar
12-23-2009, 03:17 PM
i don't have nothing on site..

problem is in script.. i don't know where?

jscheuer1
12-23-2009, 04:13 PM
Well make up a demo of the problem with just the code and some dummy content and paste it here. Some thing like (which works by the way):


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">

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

</style>

<script type="text/javascript">

/***********************************************
* Floating Top Bar script- Dynamic Drive (www.dynamicdrive.com)
* Sliding routine by Roy Whittle (http://www.javascript-fx.com/)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var persistclose = 1 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session or daysOff
var daysOff = 1 //set days persistence for close, use null for session only
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
}

var cookie = {
set: function(n, v, d){ // cookie.set takes (name, value, optional_persist_days) - defaults to session if no days specified
if(d){var dt = new Date();
dt.setDate(dt.getDate() + d);
d = '; expires=' + dt.toGMTString();}
document.cookie = n + '=' + escape(v) + (d || '') + '; path=/';
},
get: function(n){ // cookie.get takes (name)
var c = document.cookie.match('(^|;)\x20*' + n + '=([^;]*)');
return c? unescape(c[2]) : null;
},
kill: function(n){ // cookie.kill takes (name)
cookie.set(n, '', -1);
}
};

function closebar(){
if (persistclose)
cookie.set('remainclosed', '1', daysOff);
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 || !cookie.get('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>
<body>
<div id="topbar">
<a href="" onClick="closebar(); return false"><img src="close.gif" border="0" /></a>
Your content here.
</div>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
<p>Hi</p>
</body>
</html>