Please note, this is a STATIC archive of website www.tutorialspoint.com from 11 May 2019, cach3.com does not collect or store any user information, there is no "phishing" involved.
Tutorialspoint
Home
Q/A
Tools
Coding Ground
Current Affairs
UPSC Notes
Online Tutors
Code Examples
Whiteboard
Net Meeting
Articles
Library
Videos
eBooks

resposta-sopt

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>

var arr = ["A","B","C"];

function getItem(arr) {
    arr.push(arr.shift());
    return arr[arr.length -1];
}

alert(getItem(arr));
alert(getItem(arr));
alert(getItem(arr));
alert(getItem(arr));

</script>
</head>
<body>
</body>
</html>

Doppelspalt

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head> </head>
    <div>
  <div class="content">
        
      <article class="animation animation-1col-width ">
                <div  class="ds-1col node node--animation view-mode-animation node--animation node--animation--animation clearfix">

  
  <div class="field field--name-field-animation-html field--type-text-with-summary field--label-hidden">
        <div class="field__items">
                <div class="field__item even"> <div class="LEIFI_animation" style="width:900px; height:420px"> <!-- mit Rahmen 902 x 422 -->
			<div class="LEIFI_parameter" style="left:0px; top:0px; width:200px; height:420px">
				<div style="top:20px;"><span class="LEIFI_span_zentriert" style="width:180px">Doppelspalt</span></div>
				<div style="top:40px;"><span class="LEIFI_span_zentriert" style="width:180px"><em>N</em> = 2</span></div>
				<div style="top:90px;"><span class="LEIFI_span_zentriert" style="width:180px">Spaltabstand</span></div>
				<div style="top:110px;"><span id="dsiv_d_text" class="LEIFI_span_zentriert" style="width:180px"><em>d</em></span></div>
				<div style="top:130px;"><input type="range" id="dsiv_d" class="LEIFI_range" style="width: 180px;"></div>
				<div style="top:160px;"><span class="LEIFI_span_zentriert" style="width:180px">Spaltbreite</span></div>
				<div style="top:180px;"><span id="dsiv_b_text" class="LEIFI_span_zentriert" style="width:180px"><em>b</em></span></div>
				<div style="top:200px;"><input type="range" id="dsiv_b" class="LEIFI_range" style="width: 180px;"></div>
				<div style="top:230px;"><span class="LEIFI_span_zentriert" style="width:180px">Wellenlänge</span></div>
				<div style="top:250px;"><span id="dsiv_lambda_text" class="LEIFI_span_zentriert" style="width:180px"><em>λ</em></span></div>
				<div style="top:270px;"><input type="range" id="dsiv_lambda" class="LEIFI_range" style="width: 180px"></div>
			</div>
			<div class="LEIFI_leinwand" style="left:200px; top:0px; width:700px; height:420px"><canvas width="700" height="420" id="dsiv_leinwand" >HTML5-Canvas nicht unterst&uuml;tzt!</canvas></div>
<script>
// Doppelspalt - Intensitätsverteilung (Simulation)
// 6.3.2017

// ****************************************************************************
// * Autor: Thomas Unkelbach für LEIFIphysik.de                               *
// * Dieses Programm darf - auch in veränderter Form - für nicht-kommerzielle *
// * Zwecke verwendet und weitergegeben werden, solange dieser Hinweis nicht  *
// * entfernt wird.                                                           *
// ****************************************************************************

document.addEventListener("DOMContentLoaded",doppelspalt_intensitaetsverteilung_simulation (),false);

function doppelspalt_intensitaetsverteilung_simulation () {

var canvas = document.getElementById("dsiv_leinwand");
var ctx = canvas.getContext("2d");

var d = document.getElementById("dsiv_d");
	d.min = 500;
	d.max = 5000;
	d.step = 100;
	d.value = 2500;
	d.addEventListener("change", aktualisiere, false);
	d.addEventListener("input", aktualisiere, false);
var d_text = document.getElementById("dsiv_d_text");

var b = document.getElementById("dsiv_b");
	b.min = 10;
	b.max = 500;
	b.step = 10;
	b.value = 2500;
	b.addEventListener("change", aktualisiere, false);
	b.addEventListener("input", aktualisiere, false);
var b_text = document.getElementById("dsiv_b_text");

var lambda = document.getElementById("dsiv_lambda");
	lambda.min = 380;
	lambda.max = 780;
	lambda.step = 1;
	lambda.value = 580;
	lambda.addEventListener("change", aktualisiere, false);
	lambda.addEventListener("input", aktualisiere, false);
var lambda_text = document.getElementById("dsiv_lambda_text");

var KS = {
	x: 10,
	y: 110,
	breite: 680,
	hoehe: 300,
	hintergrundfarbe: "#FFFFFF",

	xanfang: -90,
	xende: 90,
	xachsenfarbe: "#000000",
	xachsenlinienbreite: 1,
	xachsenlinienenden: "round",

	xstriche: true,
	xstricheanfang: -80,
	xstricheende: 80,
	xstricheschrittweite: 10,
	xhoehe: 10,

	xtext1schriftart: "italic bold 11pt Arial",
	xtext1: "α",
	xtext1xversatz: -40,
	xtext2schriftart: "bold 11pt Arial",
	xtext2: "in º",
	xtext2xversatz: -25,
	xtextyversatz: -8,

	xursprung: true,
	xskala: true,
	xskalaanfang: -80,
	xskalaende: 80,
	xskalaschrittweite: 10,
	xskalastellen: 0,
	xskalaxversatz: -15,
	xskalayversatz: 20,

	yanfang: -10,
	yende: 110,
	yachsenfarbe: "#000000",
	yachsenlinienbreite: 1,
	yachsenlinienenden: "round",

	ystriche: true,
	ystricheanfang: 10,
	ystricheende: 100,
	ystricheschrittweite: 10,
	ybreite: 10,

	ytext1schriftart: "italic bold 11pt Arial",
	ytext1: "I",
	ytext1xversatz: 8,
	ytext2schriftart: "bold 11pt Arial",
	ytext2: "in %",
	ytext2xversatz: 18,
	ytextyversatz: -15,

	yursprung: true,
	yskala: true,
	yskalaanfang: 10,
	yskalaende: 100,
	yskalaschrittweite: 10,
	yskalastellen: 0,
	yskalaxversatz: -22,
	yskalayversatz: -5,

	rasterfarbe: "#000000",
	rasterlinienbreite: 0.25,
	rasterlinienenden: "round",
	xraster: true,
	xrasteranfang: -90,
	xrasterende: 90,
	xrasterschrittweite: 10,
	yraster: true,
	yrasteranfang: -10,
	yrasterende: 110,
	yrasterschrittweite: 10,

	eps: 0.01
	}

var x = new Array(KS.breite);
	for (var i=0; i<KS.breite; i++) x[i] = KS.xanfang + i*(KS.xende-KS.xanfang)/(KS.breite);
var x2 = new Array(KS.breite);
	for (var i=0; i<KS.breite; i++) x2[i] = x[i]*Math.PI/180;
var y = new Array(KS.breite);
var ye = new Array(KS.breite);

aktualisiere ();

function aktualisiere() {
	d_text.innerHTML = "<em>d</em> = " + d.value + "nm";
	b_text.innerHTML = "<em>b</em> = " + b.value + "nm";
	lambda_text.innerHTML = "<em>λ</em> = " + lambda.value + "nm";

	var k0, k1, k2, k3;

	for (var i=0; i<KS.breite/2; i++) {
		k0 = Math.sin(x2[i])/(Number(lambda.value));
		k1 = Math.PI*Number(b.value)*k0;
		k2 = Math.sin(k1)/k1;
		ye[KS.breite-i] = ye[i] = 100*k2*k2;
		k3 = Math.cos(Math.PI*Number(d.value)*k0);
		y[KS.breite-i] = y[i] = k3*k3*ye[i];
		}
	ye[KS.breite/2] = 100;
	y[KS.breite/2] = 100;

	ctx.clearRect(0, 0, canvas.width, canvas.height);
	zeichneRechteckDirekt(ctx,9,10,682,90,"#000000",0,"#000000","round");
	for (var i=0; i<=KS.breite; i++) {
		zeichneStreckeDirekt(ctx,10+i,20,10+i,90,rgb2(Number(lambda.value)*1e-9,0.01*y[i]),1.5,"butt");
		}

	zeichneKoordinatensystem (ctx,KS);
	zeichneKoordinatensystemKurve1 (ctx,KS,x,y,"#000000",2,"round");
	zeichneKoordinatensystemKurve1 (ctx,KS,x,ye,"#FF0000",2,"round");
	}

function zeichneRechteckDirekt(ctx,R_x,R_y,R_breite,R_hoehe,R_farbe,R_randbreite,R_randfarbe,R_randenden) {
	ctx.beginPath();
	ctx.rect(R_x, R_y, R_breite, R_hoehe);
	ctx.fillStyle = R_farbe;
	ctx.fill();
	if (R_randbreite > 0){
		ctx.lineWidth = R_randbreite;
		ctx.strokeStyle = R_randfarbe;
		ctx.lineCap = R_randenden;
		ctx.stroke();
		}
	}

function zeichneStreckeDirekt(ctx,xa,ya,xe,ye,farbe,breite,enden) {
	ctx.beginPath();
	ctx.moveTo(xa, ya);
	ctx.lineTo(xe, ye);
	ctx.strokeStyle = farbe;
	ctx.lineWidth = breite;
	ctx.lineCap = enden;
	ctx.stroke();
	}

// Hilfsroutine: Multiplikation mit 256, Umwandlung in zweistellige Hexadezimalzahl (Zeichenkette)
// z ... Gegebene Zahl

function toHex (z) {
  if (z < 0) z = 0;                                        // Negative Zahl korrigieren
  if (z > 1) z = 1;                                        // Zahl über 1 korrigieren
  var n = Math.floor(256*z);                               // Multiplikation mit 256
  var hex = n.toString(16);                                // Umwandlung in Hexadezimalzahl (Zeichenkette)
  if (hex.length < 2) hex = "0"+hex;                       // Falls einstellig, führende Null hinzufügen
  if (hex.length > 2) hex = "ff";                          // Zu große Hexadezimalzahl verhindern
  return hex;                                              // Rückgabewert
  }
  
// Berechnung der RGB-Darstellung (Algorithmus von Bruton):
// lambda ... Wellenlänge (m)
// relInt ... relative Intensität (0 bis 1, optional, Defaultwert 1)
// Rückgabewert: Zeichenkette im Format "#rrggbb"
    
function rgb (l, relInt) {
  l *= 1e9;                                           // Umrechnung in nm
  if (relInt == undefined) relInt = 1;                     // Gegebenenfalls Defaultwert für relInt verwenden
  var r1 = 0, g1 = 0, b1 = 0;                              // Rot-, Grün- und Blau-Anteil (jeweils 0 bis 1)
  if (l >= 380 && l < 440) {
    r1 = (440-l)/60; g1 = 0; b1 = 1;
    }
  else if (l < 490) {
    r1 = 0; g1 = (l-440)/50; b1 = 1;
    }
  else if (l < 510) {
    r1 = 0; g1 = 1; b1 = (510-l)/20;
    }
  else if (l < 580) {
    r1 = (l-510)/70; g1 = 1; b1 = 0;
    }
  else if (l < 645) {
    r1 = 1; g1 = (645-l)/65; b1 = 0;
    }
  else if (l <= 780) {
    r1 = 1; g1 = 0; b1 = 0;
    }
  var f = 0;                                               // Faktor für Abschwächung am Rand
  if (l >= 380 && l < 420) 
    f = 0.3+0.7*(l-380)/40;
  else if (l < 700)
    f = 1;
  else if (l <= 780)
    f = 0.3+0.7*(780-l)/80;
  var gamma = 0.8;                                         // Exponent
  var r2 = relInt*Math.pow(f*r1,gamma);                    // Rot-Anteil unter Berücksichtigung der Intensität
  var g2 = relInt*Math.pow(f*g1,gamma);                    // Grün-Anteil unter Berücksichtigung der Intensität
  var b2 = relInt*Math.pow(f*b1,gamma);                    // Blau-Anteil unter Berücksichtigung der Intensität
  return "#"+toHex(r2)+toHex(g2)+toHex(b2);                // Rückgabewert
  }
  
// Berechnung der RGB-Darstellung (Variante: für kleinere Intensität aufgehellt)
// lambda ... Wellenlänge (m)
// relInt ... relative Intensität (0 bis 1, optional, Defaultwert 1)
// Rückgabewert: Zeichenkette im Format "#rrggbb"
    
function rgb2 (lambda, relInt) {
  return rgb(lambda,Math.pow(relInt,1/3));                                    // Rückgabewert
  }

function zeichneKoordinatensystem (ctx,K) {
	var xs = K.x;
	var xe = K.x + K.breite;
	var xf = K.breite/(K.xende-K.xanfang);
	var x0 = xs+Math.abs(K.xanfang)/(Math.abs(K.xanfang)+Math.abs(K.xende))*K.breite;
	var ys = K.y + K.hoehe;
	var ye = K.y;
	var yf = K.hoehe/(K.yende-K.yanfang);
	var y0 = ys-Math.abs(K.yanfang)/(Math.abs(K.yanfang)+Math.abs(K.yende))*K.hoehe;
	var phi = Math.PI/8;

	ctx.save();
	ctx.beginPath();
	ctx.rect(K.x, K.y, K.breite, K.hoehe);
	ctx.fillStyle = K.hintergrundfarbe;
	ctx.fill();

	ctx.beginPath();
	ctx.strokeStyle = K.xachsenfarbe;
	ctx.lineWidth = K.xachsenlinienbreite;
	ctx.lineCap = K.xachsenlinienenden;
	ctx.moveTo(xs, y0);
	ctx.lineTo(xe, y0);
	ctx.moveTo(xe, y0);
	ctx.lineTo(xe - K.xhoehe*Math.cos(-phi),y0 - K.xhoehe*Math.sin(-phi));
	ctx.moveTo(xe, y0);
	ctx.lineTo(xe - K.xhoehe*Math.cos(phi),y0 - K.xhoehe*Math.sin(phi));
	if (K.xstriche) {
		for (var x = K.xstricheanfang; x <= K.xstricheende; x += K.xstricheschrittweite) {
			ctx.moveTo(x*xf+x0, y0-K.xhoehe/2);
			ctx.lineTo(x*xf+x0, y0+K.xhoehe/2);
			}
		}
	ctx.fillStyle = K.xachsenfarbe;
	ctx.font = K.xtext1schriftart;
	ctx.fillText(K.xtext1,xe + K.xtext1xversatz,y0 + K.xtextyversatz);
	ctx.font = K.xtext2schriftart;
	ctx.fillText(K.xtext2,xe + K.xtext2xversatz,y0 + K.xtextyversatz);
	if (K.xskala) {
		ctx.textAlign = "center";
		for (var x = K.xskalaanfang; x <= K.xskalaende; x += K.xskalaschrittweite) {
			if (Math.abs(x) > K.eps) {
				ctx.fillText(String(x.toFixed(K.xskalastellen)),x*xf+x0,y0+K.xskalayversatz);
				}
			}
		ctx.textAlign = "left";
		}
	if (K.xursprung) {
		ctx.textAlign = "center";
		var i = 0.0;
		ctx.fillText(String(i.toFixed(K.xskalastellen)),x0,y0 + K.xskalayversatz);
		ctx.textAlign = "left";
		}
	ctx.stroke();

	ctx.beginPath();
	ctx.strokeStyle = K.yachsenfarbe;
	ctx.lineWidth = K.yachsenlinienbreite;
	ctx.lineCap = K.yachsenlinienenden;
	ctx.moveTo(x0, ys);
	ctx.lineTo(x0, ye);
	ctx.moveTo(x0, ye);
	ctx.lineTo(x0 - K.ybreite*Math.sin(-phi),ye + K.ybreite*Math.cos(-phi));
	ctx.moveTo(x0, ye);
	ctx.lineTo(x0 - K.ybreite*Math.sin(phi), ye + K.ybreite*Math.cos(phi));
	if (K.ystriche) {
		for (var y = K.ystricheanfang; y <= K.ystricheende; y += K.ystricheschrittweite) {
			ctx.moveTo(x0-K.ybreite/2, -y*yf+y0);
			ctx.lineTo(x0+K.ybreite/2, -y*yf+y0);
			}
		}
	ctx.fillStyle = K.yachsenfarbe;
	ctx.font = K.ytext1schriftart;
	ctx.fillText(K.ytext1,x0 + K.ytext1xversatz, ye - K.ytextyversatz);
	ctx.font = K.ytext2schriftart;
	ctx.fillText(K.ytext2,x0 + K.ytext2xversatz, ye - K.ytextyversatz);
	if (K.yskala) {
		ctx.textAlign = "center";
		for (var y = K.yskalaanfang; y <= K.yskalaende; y += K.yskalaschrittweite) {
			if (Math.abs(y) > K.eps) {
				ctx.fillText(String(y.toFixed(K.yskalastellen)),x0+K.yskalaxversatz,-y*yf+y0 - K.yskalayversatz);
				}
			}
		ctx.textAlign = "left";
		}
	if (K.yursprung) {
		ctx.textAlign = "center";
		var i = 0.0;
		ctx.fillText(String(i.toFixed(K.yskalastellen)),x0 + K.yskalaxversatz,y0 - K.yskalayversatz);
		ctx.textAlign = "left";
		}
	ctx.stroke();

	ctx.beginPath();
	ctx.strokeStyle = K.rasterfarbe;
	ctx.lineWidth = K.rasterlinienbreite;
	ctx.lineCap = K.rasterlinienenden;
	if (K.xraster) {
		for (var x = K.xrasteranfang; x <= K.xrasterende; x += K.xrasterschrittweite) {
			ctx.moveTo(x*xf+x0, ys);
			ctx.lineTo(x*xf+x0, ye);
			}
		}
	if (K.yraster) {
		for (var y = K.yrasteranfang; y <= K.yrasterende; y += K.yrasterschrittweite) {
			ctx.moveTo(xs, -y*yf+y0);
			ctx.lineTo(xe, -y*yf+y0);
			}
		}
	ctx.stroke();
	ctx.restore();
	}

function zeichneKoordinatensystemKurve1 (ctx,K,x,y,farbe,breite,enden) {
	ctx.save();
	ctx.beginPath();
	ctx.rect(K.x, K.y, K.breite, K.hoehe);
	ctx.clip();
	var xk = K.breite / (K.xende - K.xanfang);
	var yk = K.hoehe / (K.yende - K.yanfang);
	var xek;
	var yek;
	var xak = K.x + xk * (x[0] - K.xanfang);
	var yak = K.y + K.hoehe + yk * (K.yanfang - y[0]);
	ctx.beginPath();
	ctx.moveTo(xak, yak);
	for (var i=0; i<=x.length; i++) { 
		xek = K.x + xk * (x[i+1] - K.xanfang);
		yek = K.y + K.hoehe + yk * (K.yanfang - y[i+1]);
		ctx.lineTo(xek, yek);
		}
	ctx.strokeStyle = farbe;
	ctx.lineWidth = breite;
	ctx.lineCap = enden;
	ctx.stroke();
	ctx.restore();
	}
}
</script>
</div></div>
            </div>
</div>
</div>

<body>
</body>
</html>

Online Javascript Editor

javascript 

<html>
<body>
<iframe src="https://www.youtube.com/embed/lwf0dTW9oUI"></iframe>
<iframe src="https://www.youtube.com/embed/idVLI3s_CJo"></iframe>
</body>
</html>

coding lesson 3B

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>

   //tAsK 
var urname = prompt("what is your name?" + "<br>");
if(urname == "Kira") {
       document.write("Hello Kira!" + "<br>");
}
else {
      document.write("Hello " + urname + "! <br>");
}
   //task 4A
   document.write("Here's your weather report for today:" + "<br>")
var cloudy = prompt("is it cloudy? (yes or no)" + "<br>");
if(cloudy == "yes") {
    document.write("It might rain today, bring an umbrella!");
}
else {
    document.write("It will most likely be sunny today, go out and play!");
}

</script>
</head>
<body>
</body>
</html>

Online Javascript Editor

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>
function sayHello() {
   document.write("Hello, Coding Ground!");
}
sayHello();
</script>
</head>
<body>
</body>
</html>

Online Javascript Editor

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>
//task 6
var randomnum = Math.random()*3;
//gives a random number in the range 0-1
//inclusive of 0, but not 1

var lightmode = Math.floor(randomnum + 1);
//round a number to its nearest integer

document.write("lightmode = " + lightmode + "<br>");

if(lightmode == 1){
    document.write("Green light." + "Stop" + "!" + "<br>");
}
else if(lightmode == 2){
    document.write("Orange light." + "wait" + "!" + "<br>");
}
else{
    document.write("red light." + "Go" + "!" + "<br>");
}
document.write("<br><br>");

























</script>
</head>
<body>
</body>
</html>

traffic light (math.random)

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>

var randomnum = Math.random()*3;
var lightmode = Math.floor(randomnum + 1);
document.write("Light Mode = " + lightmode + "<br>");
if(lightmode == 1){
    document.write("gO, JUST DO IT. nikE");
}
else if(lightmode == 2){
    document.write("slow ye roll sis, have some teA");
}
else{
    document.write("STOP LOL");
}

</script>
</head>
<body>
</body>
</html>

new project

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>
function sayHello() {
   document.write("Hello, Coding Ground!");
}
sayHello();
</script>
</head>
<body>
</body>
</html>

lesson 3b

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>
//task 6
var randomnum = Math.random()*3
//random( return a random number between 0 (inclusive) and 1 (exclusive):

var lightmode = Math.floor(randomnum)+1
//floor( round a number downward to its nearest integer)

document.write("Light Mode = " + lightmode + "<br>");

if (lightmode == 1){
    document.write(" Light is green. Cross the road.")
}
else if (lightmode == 2){
    document.write(" Light is red. Do not cross the road.")
}
else{
    document.write(" Light is orange. Get ready to cross the road..")
}


</script>
</head>
<body>
</body>
</html>

weather checking program

javascript 

<!DOCTYPE html>
<html>
<title>Web Page Design</title>
<head>
<script>

document.write("task 2: <br>")
var weather = prompt("Is the weather sunny or cloudy today?")
if(weather == "sunny") {
   document.write("go out and play.")
}
else {
   document.write("bring an umbrella.")
}

</script>
</head>
<body>
</body>
</html>

Previous 1 ... 6 7 8 9 10 11 12 ... 264 Next
Advertisements
Loading...
img img img img img img

Follow

© Copyright 2019. All Rights Reserved.

Newsletter

We use cookies to provide and improve our services. By using our site, you consent to our Cookies Policy.