Login  |  Register
HTML5 Icon HTML5 Icon HTML5 Icon
TP on Social Media

Recent

Welcome, Guest. Please login or register.
Did you miss your activation email?

August 09, 2022, 03:57:58 AM

Login with username, password and session length
Members
  • Total Members: 3842
  • Latest: Kokoro
Stats
  • Total Posts: 193478
  • Total Topics: 21088
  • Online today: 53
  • Online ever: 1035
  • (November 26, 2020, 04:45:12 AM)
Users Online
Users: 0
Guests: 39
Total: 39

Author Topic: Screenmate / Virtual pet  (Read 3013 times)

0 Members and 1 Guest are viewing this topic.

akulion

  • Guest
Screenmate / Virtual pet
« on: December 13, 2006, 02:02:17 PM »
hi

this is pretty cute - but some may find it annoying but either ways its a neat thingie...

In this I have only put one small animation of an alien, but u could use anything u like - any small animated gif from the net - whether its a flying angel or a dancing bear is up to u :P

Demo can be found on: http://goofy-goobers.com/forum

To install copy the alien gif attached to this post and upload to ur forum root

and the put this code in a script box - now one thing to know here is if you choose the block to be collapsible, then pressing the collapse button turns the screen mate off and expanding it makes him visible again...so u can use it as an on off switch if u like ;)

oh and one more thing change the link goofy-goobers.com (right near the end of the code) to your own page or whatever you want or if you prefer u can remove the link altogether by removing the A href tag :)

Code: [Select]
<head><script language="javascript">

var maxX=2;  // MAX HORIZ PIXEL STEPS
var maxY=2;  // MAX VERT PIXEL STEPS

var ns4=(document.layers)?true:false;
var ie4=(document.all && !document.getElementById)?true:false;
var ie5=(document.all && document.getElementById)?true:false;
var ns6=(document.getElementById&&navigator.appName.indexOf("Netscape")>=0)?true:false;
var w3c=(document.getElementById)?true:false;
var ww=0; var wh=0;
var ydir=true; var xdir=true;
var floatobj;
var x=0; var y=0;
var stepX=1;
var stepY=1;

function getwindowsize(){
ww=(ie4||ie5)?document.body.clientWidth:window.innerWidth;
wh=(ie4||ie5)?document.body.clientHeight:window.innerHeight;
}

function randomdir(){
if(Math.floor(Math.random()*2))stepX=Math.floor(Math.random()*maxX)+1;
if(Math.floor(Math.random()*2))stepY=Math.floor(Math.random()*maxY)+1;
if(Math.floor(Math.random()*2))xdir=(Math.floor(Math.random()*2))?false:true;
if(Math.floor(Math.random()*2))ydir=(Math.floor(Math.random()*2))?false:true;
setTimeout('randomdir()', Math.floor(Math.random()*5000)+600);
}

function moveid(id,x,y){
if(ns4)id.moveTo(x,y);
else{
id.style.left=x+'px';
id.style.top=y+'px';
}}

function animate(){
var sx=(ie4||ie5)?document.body.scrollLeft:pageXOffset;
var sy=(ie4||ie5)?document.body.scrollTop:pageYOffset;
var tp=(ns4)?floatobj.top:parseInt(floatobj.style.top);
var lf=(ns4)?floatobj.left:parseInt(floatobj.style.left);
var tx,ty;
if(ydir){
if(tp+stepY>=wh+sy-floatobj.ih-4){
ydir=false;
ty=tp-stepY;
}else ty=tp+stepY;
}else{
if(tp-stepY<=sy){
ydir=true;
ty=tp+stepY;
}else ty=tp-stepY;
}
if(xdir){
if(lf+stepX>=ww+sx-floatobj.iw-3){
xdir=false;
tx=lf-stepX;
}else tx=lf+stepX;
}else{
if(lf-stepX<=sx){
xdir=true;
tx=lf+stepX;
}else tx=lf-stepX;
}
moveid(floatobj,tx,ty);
}

window.onload=function(){
  floatobj=(ns4)?document.layers['floatobj']:(ie4)?document.all['floatobj']:document.getElementById('floatobj');
  floatobj.iw=(ns4)?floatobj.document.images["float"].width:document.images["float"].width;
  floatobj.ih=(ns4)?floatobj.document.images["float"].height:document.images["float"].height;
  if(ns6){
  floatobj.iw+=10;
  floatobj.ih+=10;
  }
  getwindowsize();
  x=ww/2;
  y=wh/2;
  moveid(floatobj,x,y);
  randomdir();
  setInterval('animate()',50);
}


window.onresize=function(){
  if(ns4)setTimeout('history.go(0)',400);
  else getwindowsize();
}
</script>

</style>

</head>
<div id="floatobj" style="width:46px; height:38px; position:absolute; left:0px; top:-200px; z-index:10000">
<a href="http://goofy-goobers.com"><img src="space.gif" border="0" width=46 height=38 name="float"></a>
</div>
« Last Edit: December 13, 2006, 02:17:03 PM by Aku »

akulion

  • Guest
Re: Screenmate / Virtual pet
« Reply #1 on: December 13, 2006, 06:05:11 PM »
I have also added a "random pet / image" funcionality to the script

So that with each page load there is a different image loaded. You can see the demo at my live site http://path-to-peace.com/forum

As for instructions just download the file attached to this post and follow instructions in the readme.txt file in it :up:

Also for additional 'cute' graphics and animations you can visit my graphics collection with over 4000+ graphics in it at: Aku's Graphics