login  Naam:   Wachtwoord: 
Registreer je!
 Scripts:
Scripts > JS > Overige > Blok laten glijden

Blok laten glijden

Auteur: michielvsb - 09 oktober 2005 - 10:27 - Gekeurd door: Ontani - Hits: 4576 - Aantal punten: (0 stemmen)



Hier kan je de inhoud van een laag (div) laten heen en weer glijden.

Code:
In de HEAD-tags :
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <script type="text/javascript">
  2. <!--
  3. var DHTML = (document.getElementById || document.all || document.layers);
  4. var blok
  5.  
  6.  
  7. function initieer(){
  8. 	blok = new getObj('roodblok');
  9. 	blok.xpos = parseInt(blok.style.left);
  10. 	blok.actief = false;
  11. 	blok.waarde = 5;
  12. 	blok.grensR = 300;
  13. 	blok.grensL = 100;
  14. }
  15.  
  16. function getObj(name)
  17. {
  18.   if (document.getElementById)
  19.   {
  20.   	this.obj = document.getElementById(name);
  21. 	this.style = document.getElementById(name).style;
  22.   }
  23.   else if (document.all)
  24.   {
  25. 	this.obj = document.all[name];
  26. 	this.style = document.all[name].style;
  27.   }
  28.   else if (document.layers)
  29.   {
  30.    	this.obj = document.layers[name];
  31.    	this.style = document.layers[name];
  32.   }
  33. }
  34.  
  35. function begin(){
  36. 	blok.actief = true;
  37. 	glijden();
  38. }
  39.  
  40. function stop(){
  41. 	blok.actief = false;
  42. }
  43.  
  44. function glijden(){
  45. 	if(blok.actief){
  46. 		if(blok.xpos > blok.grensR || blok.xpos < blok.grensL){
  47. 			blok.waarde = -blok.waarde;
  48. 		}
  49. 		blok.xpos += blok.waarde;
  50. 		blok.style.left = blok.xpos;
  51. 		window.status = blok.xpos; //voor de lol
  52. 		window.setTimeout("glijden()",30);
  53. 	}
  54. }
  55.  
  56. // -->
  57. </script>

In de Body-tags :
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <body onload="initieer()">
  2. <div id="roodblok" style="position:absolute;width:40px;height:40px;top:100px;left:100px;background-color:red"></div>

En dan nog de Start en Stop button :
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <input type="button" value="start" onclick="begin()">
  2. <input type="button" value="stop" onclick="stop()">
Download code! Download code (.txt)

 Stemmen
Niet ingelogd.

 Reacties
Post een reactie
Geen reacties (0)
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.035s