php forum
php mysql forum
php mysql smarty
 
Topic Options
#311610 - 10/05/06 06:46 PM Floating banner script
arentzen Offline
Newbie

Registered: 10/05/06
Posts: 19
Loc: Denmark
Hej!
I have at floating script, which makes it possible for a banner, picture, box or whatever you want, to float up and down when you scrolling the page. The script will both work in relative or absolute position. I have only used it in relative position, in a large <td>. I havent translated the comments, it will be another day sleep

1. Put this code into your HEAD section:
Code:
<script language="javascript">
<!--
flyderX=1; //vandret afstand fra kant.Anvendes kun ved absolute position.
flyderY=1; // Lodret afstand fra kant.Anvendes kun ved absolute position. 
elementbredde=148;
elementhøjde=800; 
talign=""; // Definerer hvilken skærmkant flyderX skal regnes fra ved absolut positionering. Top-center-bottom. 
valign="top"; // Definerer placering af elementets visning på skærmen. Top- center-bottom.
forsinkelse=3; // Tidsforsinkelse før elementet er positioneret. 0- hurtig/ 3-langsom.

(NS6)=false;
(IE6)=(document.all);
if (!IE6) {NS6=(document.getElementById);}

function adjust() {
if (NS6) {
if (lastX==-1 || forsinkelse==0)
{
lastX=window.pageXOffset + flyderX;
lastY=window.pageYOffset + flyderY;
}
else
{
var dx=Math.abs(window.pageXOffset+flyderX-lastX);
var dy=Math.abs(window.pageYOffset+flyderY-lastY);
var d=Math.sqrt(dx*dx+dy*dy);
var c=Math.round(d/10);
if (window.pageXOffset+flyderX>lastX) {lastX=lastX+forsinkelse+c;}
if (window.pageXOffset+flyderX<lastX) {lastX=lastX-forsinkelse-c;}
if (window.pageYOffset+flyderY>lastY) {lastY=lastY+forsinkelse+c;}
if (window.pageYOffset+flyderY<lastY) {lastY=lastY-forsinkelse-c;}
}
if (NS6){
//document.getElementById('flyderbanner').style.left=lastX;
document.getElementById('flyderbanner').style.top=lastY;
}
}
else if (IE6){
if (lastX==-1 || forsinkelse==0)
{
lastX=document.body.scrollLeft + flyderX;
lastY=document.body.scrollTop + flyderY;
}
else
{
var dx=Math.abs(document.body.scrollLeft+flyderX-lastX);
var dy=Math.abs(document.body.scrollTop+flyderY-lastY);
var d=Math.sqrt(dx*dx+dy*dy);
var c=Math.round(d/10);
if (document.body.scrollLeft+flyderX>lastX) {lastX=lastX+forsinkelse+c;}
if (document.body.scrollLeft+flyderX<lastX) {lastX=lastX-forsinkelse-c;}
if (document.body.scrollTop+flyderY>lastY) {lastY=lastY+forsinkelse+c;}
if (document.body.scrollTop+flyderY<lastY) {lastY=lastY-forsinkelse-c;}
//if (document.body.scrollTop+flyderY>lastY){LastY=LastY+(document.body.scrollTop(0,5-LastY)+1)+'0'}
}
//document.all['flyderbanner'].style.posLeft = lastX;
document.all['flyderbanner'].style.posTop = lastY;
} 
setTimeout('adjust()',50);
}// Her kan delay yderligere ændres.

function define()
{
if (NS6) 
{ 
if (talign=="left") {flyderX=iflyderX};
if (talign=="right") {flyderX=window.innerWidth-iflyderX-layerwidth-20};
if (talign=="center") {flyderX=Math.round((window.innerWidth-20)/2)-Math.round(layerwidth/2)};
if (valign=="top") {flyderY=iflyderY};
if (valign=="bottom") {flyderY=window.innerHeight-iflyderY-layerheight};
if (valign=="center") {flyderY=Math.round((window.innerHeight-20)/2)-Math.round(layerheight/2)};
}
if (IE6) 
{
if (talign=="left") {flyderX=iflyderX};
if (talign=="right") {flyderX=document.body.offsetWidth-iflyderX-layerwidth-20}
if (talign=="center") {flyderX=Math.round((document.body.offsetWidth-20)/2)-Math.round(layerwidth/2)}
if (valign=="top") {flyderY=iflyderY};
if (valign=="bottom") {flyderY=document.body.offsetHeight-iflyderY-layerheight}
if (valign=="center") {flyderY=Math.round((document.body.offsetHeight-20)/2)-Math.round(layerheight/2)}
}
}
//-->
</script> 


2. Put this code just BEFORE the thing you wants to float:
Code:
<script>
if ((IE6) || (NS6)) {document.write('<div id="flyderbanner" style="position:relative; left:'+flyderX+'; top:'+flyderY+';">');}
</script> 


3. Put this code AFTER the thing you wants to float:
Code:
<script>
if ((IE6) || (NS6)) 
{
document.write('</DIV>');
}
iflyderX=flyderX;
iflyderY=flyderY;
define();
window.onresize=define;
lastX=-1;
lastY=-1;
adjust();
</script>
 

Thats it! Just float it if you dare...
_________________________
Peter Arentzen
trosfrihed.dk

Top
#311636 - 10/10/06 12:07 AM Re: Floating banner script [Re: arentzen]
AllenAyres Administrator Online   content
I type Like navaho

Registered: 03/10/00
Posts: 25383
Loc: Texas
Cool, thank you for sharing smile
_________________________
- Allen wavey
- What Drives You?

Top
#311728 - 10/15/06 02:52 AM Re: Floating banner script [Re: AllenAyres]
arentzen Offline
Newbie

Registered: 10/05/06
Posts: 19
Loc: Denmark
Allright! Heres the script with english comments, edited to use in absolute position. As an exampel of use, I have put in one of my bannerscripts marked with red.

1. Copy this code into your <HEAD> section:

Code:
<SCRIPT LANGUAGE="JavaScript">
<!--
flyderX=10; //Horizontal distance from monitor border. Only used in absolute position.
flyderY=10; // Vertical distance from monitor border.Only used in absolute position. 
layerwidth=148; // Element width.
layerheight=74; // Element height.
halign="top"; // Defines which monitor border FlyderX shall be couted from in absolute position. Top- center- bottom. 
valign="top"; // Defines the postion of the elements' placement on the monitor. Top- center-bottom.
delayspeed=3; //  Delay before element has been positioned. 0- fast/ 3-slow.

 (NS6)=false;
(IE6)=(document.all);
if (!IE6) {NS6=(document.getElementById);}

function adjust() {
if (NS6) {
if (lastX==-1 || delay==0)
{
lastX=window.pageXOffset + flyderX;
lastY=window.pageYOffset + flyderY;
}
else
{
var dx=Math.abs(window.pageXOffset+flyderX-lastX);
var dy=Math.abs(window.pageYOffset+flyderY-lastY);
var d=Math.sqrt(dx*dx+dy*dy);
var c=Math.round(d/10);
if (window.pageXOffset+flyderX>lastX) {lastX=lastX+delay+c;}
if (window.pageXOffset+flyderX<lastX) {lastX=lastX-delay-c;}
if (window.pageYOffset+flyderY>lastY) {lastY=lastY+delay+c;}
if (window.pageYOffset+flyderY<lastY) {lastY=lastY-delay-c;}
}
if (NS6){
document.getElementById('flyderbanner').style.left=lastX;
document.getElementById('flyderbanner').style.top=lastY;
}
}
else if (IE6){
if (lastX==-1 || delay==0)
{
lastX=document.body.scrollLeft + flyderX;
lastY=document.body.scrollTop + flyderY;
}
else
{
var dx=Math.abs(document.body.scrollLeft+flyderX-lastX);
var dy=Math.abs(document.body.scrollTop+flyderY-lastY);
var d=Math.sqrt(dx*dx+dy*dy);
var c=Math.round(d/10);
if (document.body.scrollLeft+flyderX>lastX) {lastX=lastX+delay+c;}
if (document.body.scrollLeft+flyderX<lastX) {lastX=lastX-delay-c;}
if (document.body.scrollTop+flyderY>lastY) {lastY=lastY+delay+c;}
if (document.body.scrollTop+flyderY<lastY) {lastY=lastY-delay-c;}
if (document.body.scrollTop+flyderY>lastY){LastY=LastY+(document.body.scrollTop(0,5-LastY)+1)+'0'}
}
document.all['flyderbanner'].style.posLeft = lastX;
document.all['flyderbanner'].style.posTop = lastY;
} 
setTimeout('adjust()',50);
}

function define()
{
if (NS6) 
{ 
if (talign=="left") {flyderX=iflyderX};
if (talign=="right") {flyderX=window.innerWidth-iflyderX-layerwidth-20};
if (talign=="center") {flyderX=Math.round((window.innerWidth-20)/2)-Math.round(layerwidth/2)};
if (valign=="top") {flyderY=iflyderY};
if (valign=="bottom") {flyderY=window.innerHeight-iflyderY-layerheight};
if (valign=="center") {flyderY=Math.round((window.innerHeight-20)/2)-Math.round(layerheight/2)};
}
if (IE6) 
{
if (talign=="left") {flyderX=iflyderX};
if (talign=="right") {flyderX=document.body.offsetWidth-iflyderX-layerwidth-20}
if (talign=="center") {flyderX=Math.round((document.body.offsetWidth-20)/2)-Math.round(layerwidth/2)}
if (valign=="top") {flyderY=iflyderY};
if (valign=="bottom") {flyderY=document.body.offsetHeight-iflyderY-layerheight}
if (valign=="center") {flyderY=Math.round((document.body.offsetHeight-20)/2)-Math.round(layerheight/2)}
}
}
//-->
</script> 


2. Copy this code into your <BODY> section.

<script>
if ((IE6) || (NS6)) {document.write('<div id="flyderbanner" style="position:absolute; left:'+flyderX+'; top:'+flyderY+';">');}
</script>
<script language='JavaScript' type='text/javascript' src='http://ann.kristeligt-dagblad.dk/adx.js'></script>
<script language='JavaScript' type='text/javascript'>
<!--
if (!document.phpAds_used) document.phpAds_used = ',';
phpAds_random = new String (Math.random()); phpAds_random = phpAds_random.substring(2,11);

document.write ("<" + "script language='JavaScript' type='text/javascript' src='");
document.write ("http://ann.kristeligt-dagblad.dk/adjs.php?n=" + phpAds_random);
document.write ("&what=zone:166&block=1");
document.write ("&exclude=" + document.phpAds_used);
if (document.referrer)
document.write ("&referer=" + escape(document.referrer));
document.write ("'><" + "/script>");
//-->
</script><noscript><a href='http://ann.kristeligt-dagblad.dk/adclick.php?n=aaa45f72' target='_blank'><img src='http://ann.kristeligt-dagblad.dk/adview.php?what=zone:166&n=aaa45f72' border='0' alt=''></a></noscript>

<script>
if ((IE6) || (NS6))
{
document.write('</DIV>');
}
iflyderX=flyderX;
iflyderY=flyderY;
define();
window.onresize=define;
lastX=-1;
lastY=-1;
adjust();
</script>


The red marked bannnercode contains 2 different 148x74 banners. An advertisment for the holy bible, made as gif images and an advertisment for a organisation helping poor children, made as sfw image. Just remove the bannercode and put in something else and spend some time changeing the variables in the header code.

Good Pleasure!
_________________________
Peter Arentzen
trosfrihed.dk

Top


Top Posters Last 30 Days
AllenAyres 63
Gizmo 27
sirdude 24
Zarzal 12
blaaskaak 10
tackaberry 4
winter 3
Who's Online
1 Registered (AllenAyres), 35 Guests and 8 Spiders online.
Key: Admin, Global Mod, Mod
Shout Box

Latest Posts
iPhone 3G
by AllenAyres
07/23/08 09:59 PM
[7.x] [Beta] Purge Welcome Messages
by Gizmo
07/23/08 06:58 PM
Team UBBDev Rides Again!
by AllenAyres
07/23/08 03:23 PM
User Authentication Class
by Gizmo
07/21/08 07:07 PM
Auto repair table
by blaaskaak
07/19/08 06:16 PM
[7.3.x] ubb.links
by AllenAyres
07/18/08 05:09 PM
ubb.social
by willing
07/17/08 06:29 PM
New Mods
[7.3+] CustomTag - Photobucket Slideshow
by Gizmo
07/12/08 11:14 AM
[7.3.x] Copy forum permissions
by blaaskaak
07/09/08 02:37 PM
Protect users emails
by Basil Fawlty
06/29/08 08:44 AM
[7.3.x] Scheduled board close for backup
by blaaskaak
06/26/08 04:01 AM
[7.3+] CustomTag - Audo Embedding
by Gizmo
06/24/08 07:52 PM
Newest Members
nixadmin, Stanley, NazzaN, mmem700, Tyler
13310 Registered Users

 

 

 
fusionbb message board php hacks