< >

explodierendecanvas-uhr.php


Quell Code


<!DOCTYPE html>
<html id="basti1012" lang="de-DE" dir="LTR" chttp://sebastian1012.bplaced.net/homepage-neu/txt/index.php?name=laenderliste.txtlass="">
<head>
 
<meta charset="utf-8">
<title>Homepage,Forum,Basti1012</title>
<link rel="Shortcut Icon" href="favicon.png" type="image/x-icon" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<meta name="author" content="Sebastian koester">
<meta name="publisher" content="Sebastian Koester">
<meta name="copyright" content="Sebastian Koester">
<meta name="description" content="Eine Seite die nur ausJavascript besteht,Anleitungen,generatoren,und vieles  mehr">
<meta name="keywords" content="javascript, ,serscript,avascripte, userscripte,tutorials,generatoren,anleitungen,basti1012,sebastian1012,pennerhack,pennerhackisback,pennergame, scripte">
<meta name="page-type" content="Private Homepage">
<meta name="audience" content="Alle, Anfaenger, Experten, Fortgeschrittene, Jugendliche, Profis, Schueler, Studenten"> 
<meta name="robots" content="index, follow">

<meta name="DC.Description" content="Eine Seite die nur ausJavascript besteht,Anleitungen,generatoren,und vieles  mehr">
<meta name="DC.Language" content="de">
<meta name="title" content="basti1012">
<meta name="revisit-after" content="after 20 days">
<meta name="date" content="2018-01-10">
<meta name="page-topic" content="scripte">
<meta name="generator" content="http://sebastian1012.bplaced.net/">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
       



<style>
 


footer{
    display:flex;
    text-align:center;
}
footer a,#copy{
    text-align:center;
    margin-left:10%;
    color:blue;
}

footer img{
height:20px;
width:15px;
}

textarea{
    width:70%;
 display:flex;
    margin-left:10%;
    overflow:auto;
        display: inline-block;
    min-height: 10px;
}
 
  
body{
    background: radial-gradient(circle at center, transparent, #000 95%), linear-gradient(#444 2px, transparent 0) 0 0/20px 20px, linear-gradient(90deg, #444 2px, #000 0) 0 0/20px 20px;
  margin: 0;
  overflow: auto;
 
}
.infocode{
  font-size:18px;
  font-weight:900;
  color:green;
  overflow:auto;
}
 
 p{
    color:white;
  text-align:center;
  margin-left:0%;
}
.code1{height:auto;}
.code2{height:auto;}
.code3{height:auto;}
.code4{height:auto;}
.infocode1{color:red;}
.infocode2{color:red;}
.infocode3{color:red;}
.infocode4{color:red;}
.infocode5{color:red;}
</style>

 <style>
 
canvas {
  height: 100%;
  left: 0;
  position:fixed;
  z-index:-1;
  top: 0;
  width: 100%;
   overflow:hidden;
}
 h1{
    margin-left:30%;
    font-size:40px;
    text-decoration:underline;
    color:white;
}
 h2{
    margin-left:36%;
    font-size:30px;
    text-decoration:underline;
    color:white;
    margin-bottom:0px;
}


</style>





































<style>
body {
  margin:0;
  padding:0;
 
}

canvas {
  background-image: radial-gradient(black, hsl(10,90%,15%));
  margin:0;
}
 
</style>


























</head>
 




 <body>
<div id="seitenmenu1"></div>
<span id="tooltip_container"> </span>
















<h1>Canvas Hintergrund  10</h1>
<p class="infocode infocode1">Klick auf den Code kopiert den Code in der Zwischenablage</p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="https://code.createjs.com/createjs-2014.12.12.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"></script>

<canvas id="canvas"></canvas>








<h2>Html</h2>
<textarea onclick="this.focus();this.select();" class="code code1" id="html" data-code="Sie haben den  Html Code in der Zwischenablage Kopiert">
<canvas id="canvas"></canvas>
</textarea>
<p class="infocode infocode2">  </p>








<h2>Css</h2>
<textarea  onclick="this.focus();this.select();" class="code code2" id="css" data-code="Sie haben den Css Code in der Zwischenablage Kopiert">
body{ margin: 0; overflow: hidden; }
canvas{ background: #000; width: 100vw; height: 100vh; }


</textarea>
<p class="infocode infocode3">  </p>








<h2>Javascript</h2>
<textarea  onclick="this.focus();this.select();" class="code code3" id="java" data-code="Sie haben den  Javascript Code in der Zwischenablage Kopiert"> 
var ctx;
var stage;
var stageWidth;
var stageHeight;
var particles = [];
var particleCount = 850;
var speed = 0.3;
var cull = 3;
var r = 0;

function init(){
  var canvas = document.getElementById("canvas");
  ctx = canvas.getContext("2d");
  stage = new createjs.Stage(canvas);

  for(var i = 0; i < particleCount; i++){
    var color = "rgba("+_.random(64)+","+_.random(32,192)+",255,1)";
    var radius = Math.floor(Math.random()*10)/10 + 0.5;
    var x = 0;
    var y = 0;
    var vx = (1 - Math.random()*2);
    var vy = (1 - Math.random()*2);
    var vx2 = (1 - Math.random()*2)*0.1;
    var vy2 = (1 - Math.random()*2)*0.1;

    var particle = createParticle(color, radius, x, y, vx, vy, vx2, vy2);
    particles.push(particle);
    stage.addChild(particle);
  }

  resize();
  clock();
}

init();

function createParticle(color, radius, x, y, vx, vy, vx2, vy2){
  var particle = new createjs.Shape();
  particle.graphics.beginFill(color);
  particle.graphics.drawCircle(0,0,radius);
  particle.x = x;
  particle.y = y;
  particle.endX = x;
  particle.endY = y;
  particle.vx = vx;
  particle.vy = vy;
  particle.vx2 = vx2;
  particle.vy2 = vy2;

  return particle;
}

function clock(){
  var date = new Date();
  var h = (date.getHours() > 9) ? date.getHours() : "0"+date.getHours();
  var m = (date.getMinutes() > 9) ? date.getMinutes() : "0"+date.getMinutes();
  var s = (date.getSeconds() > 9) ? date.getSeconds() : "0"+date.getSeconds();
  var time = h + " " + m + " " + s;

  var text = new createjs.Text(time,"85px Arial","#fff");
  text.w = Math.floor(text.getMeasuredWidth());
  text.h = Math.floor(text.getMeasuredLineHeight());
  text.x = Math.floor(stageWidth/2 - text.w/2);
  text.y = Math.floor(stageHeight/2 - text.h/2);

  var rect = new createjs.Shape();
  rect.graphics.beginFill("#000");
  rect.graphics.drawRect(0,0,stageWidth,stageHeight);

  stage.compositeOperation = "default";

  stage.addChild(rect);
  stage.addChild(text);
  stage.update();

  var pixels = ctx.getImageData(text.x,text.y,text.w,text.h);

  stage.removeChild(rect);
  stage.removeChild(text);
  stage.update();

  stage.compositeOperation = "lighter";

  var i = 0;
  for(var w = 0; w < text.w; w += cull){
    for(var h = 0; h < text.h; h += cull){
      if(pixels.data[(w+text.w*h)*4] !== 0 && i < particles.length){
        var particle = particles[i];

        particle.endX = text.x+w;
        particle.endY = text.y+h;
        particle.vx = (1 - Math.random()*2);
        particle.vy = (1 - Math.random()*2);
        scale = _.random(1,40);
        particle.scaleX = scale;
        particle.scaleY = scale;
        
        i++;
      }
    }
  }

  for(var j = i; j < particles.length; j++){
    var particle = particles[j];

    if(j < r){
      particle.endX = _.random(stageWidth);
      particle.endY = _.random(stageHeight);
    }
    scale = _.random(1,5);
    particle.scaleX = scale;
    particle.scaleY = scale;
  }
  r = i;

  setTimeout(clock, 1000);
}

function tick(){
  for(var i = 0; i < particleCount; i++){
    var particle = particles[i];

    if(i < r){
      particle.endX += 1 * particle.vx/10;
      particle.endY += 1 * particle.vy/10;
      v = 1.05 + Math.random()/100;
      particle.vx *= v;
      particle.vy *= v;
    }else{
      particle.endX += particle.vx2;
      particle.endY += particle.vy2;
    }

    if(particle.x < 0){
      particle.x = stageWidth;
      particle.endX = stageWidth;
    }else if(particle.x > stageWidth){
      particle.x = 0;
      particle.endX = 0;
    }

    if(particle.y < 0){
      particle.y = stageHeight;
      particle.endY = stageHeight;
    }else if(particle.y > stageHeight){
      particle.y = 0;
      particle.endY = 0;
    }

    particle.x = particle.x + (particle.endX - particle.x)*speed;
    particle.y = particle.y + (particle.endY - particle.y)*speed;

    if(particle.scaleX > 1) particle.scaleX = particle.scaleX*0.85;
    if(particle.scaleY > 1) particle.scaleY = particle.scaleY*0.85;
  }

  stage.update();
}

function resize(){
  $("#canvas").attr("width", $(window).width());
  $("#canvas").attr("height", $(window).height());
  stageWidth = $(window).width();
  stageHeight = $(window).height();

  for(var i = 0; i < particleCount; i++){
    var particle = particles[i];

    particle.x = particle.endX = _.random(stageWidth);
    particle.y = particle.endY = _.random(stageHeight);
  }
}

$(window).resize(resize);

createjs.Ticker.setFPS(60);
createjs.Ticker.addEventListener("tick", tick);
</textarea>
<p class="infocode infocode4">   </p>






















<script>
var ctx;
var stage;
var stageWidth;
var stageHeight;
var particles = [];
var particleCount = 850;
var speed = 0.3;
var cull = 3;
var r = 0;

function init(){
  var canvas = document.getElementById("canvas");
  ctx = canvas.getContext("2d");
  stage = new createjs.Stage(canvas);

  for(var i = 0; i < particleCount; i++){
    var color = "rgba("+_.random(64)+","+_.random(32,192)+",255,1)";
    var radius = Math.floor(Math.random()*10)/10 + 0.5;
    var x = 0;
    var y = 0;
    var vx = (1 - Math.random()*2);
    var vy = (1 - Math.random()*2);
    var vx2 = (1 - Math.random()*2)*0.1;
    var vy2 = (1 - Math.random()*2)*0.1;

    var particle = createParticle(color, radius, x, y, vx, vy, vx2, vy2);
    particles.push(particle);
    stage.addChild(particle);
  }

  resize();
  clock();
}

init();

function createParticle(color, radius, x, y, vx, vy, vx2, vy2){
  var particle = new createjs.Shape();
  particle.graphics.beginFill(color);
  particle.graphics.drawCircle(0,0,radius);
  particle.x = x;
  particle.y = y;
  particle.endX = x;
  particle.endY = y;
  particle.vx = vx;
  particle.vy = vy;
  particle.vx2 = vx2;
  particle.vy2 = vy2;

  return particle;
}

function clock(){
  var date = new Date();
  var h = (date.getHours() > 9) ? date.getHours() : "0"+date.getHours();
  var m = (date.getMinutes() > 9) ? date.getMinutes() : "0"+date.getMinutes();
  var s = (date.getSeconds() > 9) ? date.getSeconds() : "0"+date.getSeconds();
  var time = h + " " + m + " " + s;

  var text = new createjs.Text(time,"85px Arial","#fff");
  text.w = Math.floor(text.getMeasuredWidth());
  text.h = Math.floor(text.getMeasuredLineHeight());
  text.x = Math.floor(stageWidth/2 - text.w/2);
  text.y = Math.floor(stageHeight/2 - text.h/2);

  var rect = new createjs.Shape();
  rect.graphics.beginFill("#000");
  rect.graphics.drawRect(0,0,stageWidth,stageHeight);

  stage.compositeOperation = "default";

  stage.addChild(rect);
  stage.addChild(text);
  stage.update();

  var pixels = ctx.getImageData(text.x,text.y,text.w,text.h);

  stage.removeChild(rect);
  stage.removeChild(text);
  stage.update();

  stage.compositeOperation = "lighter";

  var i = 0;
  for(var w = 0; w < text.w; w += cull){
    for(var h = 0; h < text.h; h += cull){
      if(pixels.data[(w+text.w*h)*4] !== 0 && i < particles.length){
        var particle = particles[i];

        particle.endX = text.x+w;
        particle.endY = text.y+h;
        particle.vx = (1 - Math.random()*2);
        particle.vy = (1 - Math.random()*2);
        scale = _.random(1,40);
        particle.scaleX = scale;
        particle.scaleY = scale;
        
        i++;
      }
    }
  }

  for(var j = i; j < particles.length; j++){
    var particle = particles[j];

    if(j < r){
      particle.endX = _.random(stageWidth);
      particle.endY = _.random(stageHeight);
    }
    scale = _.random(1,5);
    particle.scaleX = scale;
    particle.scaleY = scale;
  }
  r = i;

  setTimeout(clock, 1000);
}

function tick(){
  for(var i = 0; i < particleCount; i++){
    var particle = particles[i];

    if(i < r){
      particle.endX += 1 * particle.vx/10;
      particle.endY += 1 * particle.vy/10;
      v = 1.05 + Math.random()/100;
      particle.vx *= v;
      particle.vy *= v;
    }else{
      particle.endX += particle.vx2;
      particle.endY += particle.vy2;
    }

    if(particle.x < 0){
      particle.x = stageWidth;
      particle.endX = stageWidth;
    }else if(particle.x > stageWidth){
      particle.x = 0;
      particle.endX = 0;
    }

    if(particle.y < 0){
      particle.y = stageHeight;
      particle.endY = stageHeight;
    }else if(particle.y > stageHeight){
      particle.y = 0;
      particle.endY = 0;
    }

    particle.x = particle.x + (particle.endX - particle.x)*speed;
    particle.y = particle.y + (particle.endY - particle.y)*speed;

    if(particle.scaleX > 1) particle.scaleX = particle.scaleX*0.85;
    if(particle.scaleY > 1) particle.scaleY = particle.scaleY*0.85;
  }

  stage.update();
}

function resize(){
  $("#canvas").attr("width", $(window).width());
  $("#canvas").attr("height", $(window).height());
  stageWidth = $(window).width();
  stageHeight = $(window).height();

  for(var i = 0; i < particleCount; i++){
    var particle = particles[i];

    particle.x = particle.endX = _.random(stageWidth);
    particle.y = particle.endY = _.random(stageHeight);
  }
}

$(window).resize(resize);

createjs.Ticker.setFPS(60);
createjs.Ticker.addEventListener("tick", tick);
</script>







<h2>Was mu? eingebunden werden</h2>
<textarea  onclick="this.focus();this.select();" class="code code4" id="wasnoch" data-code="Sie haben die einzubindene Links  in der Zwischenablage Kopiert">   
 https://code.jquery.com/jquery-3.2.1.min.js
https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
https://code.createjs.com/createjs-2014.12.12.min.js
https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js

</textarea> 
<p class="infocode infocode5">    </p>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 



 
 
 
 
 
  <script>
  var ac = new Array('html','css','java','wasnoch');
 for(p=0;p<=3;p++){
   df=ac[p];
  var text = document.getElementById(df);
 if(text.scrollHeight >= 500){
       text.style.height ='499px';
 }else{
      text.style.height = text.scrollHeight+ 'px';
 }
}
 </script>
 
 
<script src="https://code.jquery.com/jquery-3.2.1.min.js"><script>
<script>
function addstyle(css) {
    var head, style;
    head = document.getElementsByTagName('body')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}
 $('.code').click(function( event ) {
$("#tooltip_container").css('display','block');
$("#tooltip_container").css('position','fixed');
$("#tooltip_container").css('left','40%');
$("#tooltip_container").css('top','40%');
aa=$(this).data('code');
 
$('#tooltip_container').text(aa);
$("#tooltip_container").fadeIn("fast");
function close1(){
$('#tooltip_container').text(''); $("#tooltip_container").fadeOut("fast");
}
setTimeout(function(){close1()},2000)
document.execCommand("copy");
});
 

addstyle('#tooltip_container{height:auto;max-width:300px;max-height:200px;overflow:auto;background:#2E3732;	color: #FFFFFF; border-radius:10px;    position:absolute; border:2px solid black;  font-size:16px;	z-index: 1000;	padding: 5px;display:none;}');
 
$('#seitenmenu').html('<div class="link1 link" id="navseite"><li class="link" id="link1q"> <img  src="http://efood.de/wp-content/uploads/2013/05/Retoure_in-blau.jpg"  > <ul></ul><li class="link1 link " id="link1">Generatoren<i class="fa fa-gear fa-spin"></i><ul><li class="link link2" id="link1113">Generatoren<ul class="raus"><li class="link link3" id="link1115">Link111</li><li class="link link3" id="link112">Link112</li><li class="link link3" id="link113">Link113</li></ul></li><li class="link link2" id="link112">Link12<ul><li class="link link3" ><a href="tttspeedtest.html">Speedtest </a></li><li class="link link3"><a href="besucherzaehler.php">Z?hler Test</a></li><li class="link link3"><a href="bissilvester.html">Bis Silvester</a></li><li class="link link3"><a href="pdftest.html">pdf Test</a></li><li class="link link3"><a href="speditions_test.html">Spedition Test</a></li><li class="link link3"><a href="xxxxxxxxxmuell_und_test">Papierkorp</a></li><li class="link link3"><a href="tttttttttttt.html">Bootstramp</a></li><li class="link link3"><a href="Export/index.php">Export</a></li><li class="link link3"><a href="meta_generator.html">Meta generator</a></li><li class="link link3"><a  href="speedtest2.html">Speedtest 2</a></li><li class="link link3"><a href="spedtest1.html">Speedtest 1</a></li></ul></li><li class="link link2" id="link143">Link13<ul><li class="link link3" id="link131">Link651</li><li class="link link3" id="link322">Link662</li><li class="link link3" id="link433">Link633</li></ul></li></ul></li><li class="link" id="link1">Link2<i class="fa fa-home"></i><ul><li class="link"><a href="webminden.html">Webcams</a></li><li class="link" ><a href="geo.html"></a></li><li class="link" ><a href="repo.html"></a></li><li class="link"><a href="flex.html"></a></li><li class="link" ><a href="geo.html"></a></li><li class="link" ><a href="repo.html"></a></li><li class="link"><a href="flex.html"></a></li><li class="link" ><a href="geo.html"></a></li><li class="link" ><a href="repo.html"></a></li></ul></li><li class="link" id="link1">Link3<i class="fa fa-image"></i><ul> <li class="link" id="link31">Link31</li> <li class="link" id="link32">Link32</li> <li class="link" id="link33">Link33</li> </ul></li> <li class="link" id="link1">Link4<i class="fa fa-dashboard"></i><ul> <li class="link" id="link41">Link41</li>  <li class="link" id="link42">Link42</li> <li class="link" id="link43">Link43</li> </ul></li> <li class="link" id="link1">Tutorials<i class="fa fa-gamepad"></i><ul> <li class="link"><a href="flex.html">Tutorial Flex-Boxen</a></li> <li class="link" ><a href="geo.html">Geometrische Figuren</a></li> <li class="link" ><a href="repo.html">Reponsives Verhalten</a></li> </ul></li> <li class="link" id="link1">Link6<i class="fa fa-external-link-square"></i><ul> <li class="link"><a href="dreieckgenerator.html">dreieckgenerator</a></li> <li class="link"><a href="testyourcode.html">Teste deinen  Code</a></li> <li class="link" ><a href="csscode.html">Css Testen</a></li> <li class="link" ><a href="boxshadow.html">Shadow-Generator</a></li> <li class="link" ><a href="quadrat.html">Quadrat Generator</a></li> <li class="link" ><a href="qrcode.html">Qr-Code Generator</a></li> <li class="link" ><a href="font.html">Font-size Generator</a></li> <li class="link" ><a href=" .html"> </a></li> <li class="link" ><a href=" .html"> </a></li> </ul></li><li class="link" id="link1">Link7<i class="fa fa-commenting"></i><ul><li class="link"><a href="http://retinaspritegenerator.com/">Srite Generator</a></li><li class="link"><a href="https://werner-zenk.de/tools/css_forms.php">Css-Formen-Generator</a></li><li class="link" ><a href="https://www.base64encode.org/">Base64 Encoder</a></li><li class="link"><a href="https://coveloping.com/tools/css-box-shadow-generator">Box-Shadow Generator</a></li><li class="link"><a href="http://www.selfhtml5.org/html5-diagramme/saeulendiagramm/html5-saeulendiagramm.php">S&auml;ulen Generator</a></li><li class="link"><a href="http://www.colorzilla.com/gradient-editor/">Gradient Generator</a></li><li class="link" ><a href="http://www.cssportal.com/css-tooltip-generator/">Tooltip Generator</a></li></ul></li><li class="link" id="link1">HPS<i class="fa fa-commenting"></i><ul><li><a id="reghex">Rgb to Hex</a></li><li><a id="taschenrechner">Taschenrechner</a></li><li><a id="farbmixer">FarbMixer</a></li><li><a id="passwort">Passwort Generator</a></li><li><a id="scriptlink1" class="scriptlink" >Basti1012 &Uuml;berschrift</a></li><li><a id="scriptlink2" class="scriptlink" >Laufbild Footer</a></li><li><a id="scriptlink3" class="scriptlink" >Top Men&uuml;</a></li><li><a id="scriptlink4" class="scriptlink" >Bahnhofsuhr</a></li><li><a id="scriptlink5" class="scriptlink" >Tolltips</a></li></ul></li></div> ');
$('#link1q').click(function(){
window.history.back();
})
$('.link3').hover(function(){
$('.link2').css('animation-play-state','paused');
});
$('.link2').hover(function(){
$(this).css('animation-play-state','running');
});
</script>
<footer>

<a id="serveruhr">Server Zeit: <span id="Datumzeit"></span> Uhr</a>
<?php echo($counter_output) ?>
<a>Ip:<?php echo($counter_user_ip) ?></a>
 
  
<?php
$dateinamen = "besucherzaehler.txt";
$handle = fopen ($dateinamen, "r");
$inhalt = fread ($handle, filesize ($dateinamen));
fclose ($handle);
 
$inhalt = $inhalt + 1;
echo "<a>Besucher Nr : <b>$inhalt</b> </a>";
 
$handle = fopen ("besucherzaehler.txt", "w");
fwrite ($handle, $inhalt);
fclose ($handle);
?>
 

<span id="copy"><script>
    document.write('&copy;');
    document.write(' Basti1012');
    document.write('  2017 - ');
    document.write(new Date().getFullYear());
</script></span>

<script>
function Serverzeit(date) {
      this.date = date;
      this.kalenderwoche = function() {
        var Datum = this.date;
        var DoDat = donnerstag(Datum);
        var kwjahr = DoDat.getFullYear();
        var DoKW1 = donnerstag(new Date(kwjahr, 0, 4)); // Anm. 2
        return Math.floor(1.5 + (DoDat.getTime() - DoKW1.getTime()) / 86400000 / 7) 
      };
      function donnerstag(datum) {
        var Do = new Date();
        Do.setTime(datum.getTime() + (3 - ((datum.getDay() + 6) % 7)) * 86400000);
        return Do;
      };
      this.update = function(dom_id) {
        var Datumsanzeige = "";
        var Wochentage = new Array('Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag');
        var Wochentag = Wochentage[this.date.getDay()];
        var Tag = this.date.getDate();
        var Monate = new Array("Januar", "Februar", "M?rz", "April", "Mai", "Juni", "Juli", "August", "Septemper", "Oktober", "November", "Dezember");
        var Monat = Monate[this.date.getMonth()];
        var Jahr = this.date.getFullYear();
        var Stunden = this.date.getHours();
        var Minuten = this.date.getMinutes();
        var Sekunden = this.date.getSeconds();
        this.date.setSeconds(Sekunden + 1);
        if (Stunden <= 9) {
          Stunden = "0" + Stunden;
        }
        if (Minuten <= 9) {
          Minuten = "0" + Minuten;
        }
        if (Sekunden <= 9) {
          Sekunden = "0" + Sekunden;
        }
        Datumzeitanzeige = Wochentag + ', ' + Tag + '. ' + Monat + ' ' + Jahr + ' - ' + Stunden + ':' + Minuten + ':' + Sekunden;
        Datumzeitanzeige = "Woche: " + this.kalenderwoche() + " - " + Datumzeitanzeige;
        document.getElementById(dom_id).innerHTML = Datumzeitanzeige
        setTimeout(function(x, dom_id) {
          return function() {
            x.update(dom_id);
          };
        }(this, dom_id), 1000);
      };
    };
    var x = new Serverzeit(new Date(1518269198000));
    x.update('Datumzeit');

  update();
function update() {
    let time = new Date(),
		hr = time.getHours(),
		min = time.getMinutes(),
		sec = time.getSeconds();
	if (hr < 10)
		hr = "0" + hr;
	if (min < 10)
		min = "0" + min;
	if (sec < 10)
		sec = "0" + sec;
	let timeStr = `${hr}${min}${sec}`,
		digits = document.querySelectorAll(".digit"),
		digitArr = [];
	for (let d in digits) {
		d = +d;
		if (d < digits.length) {
			digitArr[d] = timeStr.substr(d,1);
			digits[d].className = "digit _" + digitArr[d];
		}
	}
 }
</script>
</footer>
<script src="http://sebastian1012.bplaced.net/Meine_Scripte/seitenmenue1.js"></script>
<script src="http://sebastian1012.bplaced.net/Meine_Scripte/Back_to_the_top.js"></script>
</body> 
</html> 

Add Comment

* Required information
1000
Powered by Commentics

Comments (1)

Gravatar
Admin
Sascha65says...

Die Canvas Balken Uhr ist ja mal Fett