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: 4409 - Aantal punten: (0 stemmen)





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

Code:
In de HEAD-tags :
  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 :
  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 :
  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.038s