Javascript Beispiele

Scroll zu einer bestimmten Position

<!-- www.htmlopen.de --> <!-- Dieses HTML code wird gratis von htmlopen.de zur Verfügung gestellt www.htmlopen.de --> <SCRIPT LANGUAGE=JavaScript> !– function scrollit() { for (I=1; I<=<span style="BACKGROUND-COLOR: moccasin">1050</span>; I++){ scroll(1,I) } } –> </SCRIPT> <input name="button" type=button onClick=scrollit() value=Seite scrollen>

Dieses Eingabefeld wechselt die Hintergrundfarbe bei einer Eingabe.

<!-- Dieses HTML code wird gratis von htmlopen.de zur Verfügung gestelltwww.htmlopen.de --> <input name="text" type="text" onFocus="this.style.backgroundColor='#FFFF99'"onBlur="this.style.backgroundColor='white'">

Taschenrechner

<!-- Dieses HTML code wird gratis von htmlopen.de zur Verfügung gestelltwww.htmlopen.de --> <FORM NAME=Calc><br> <TABLE BORDER bgcolor=black cellpadding=3 cellspacing=0 align=center> <TR><TD> <INPUT TYPE=text NAME=Input Size=15></TD></TR> <TR><TD align=center> <INPUT TYPE=button VALUE=" 1" OnClick="Calc.Input.value += '1'"> <INPUT TYPE=button VALUE=" 2" OnCLick="Calc.Input.value += '2'"> <INPUT TYPE=button VALUE=" 3" OnClick="Calc.Input.value += '3'"> <INPUT TYPE=button VALUE=" +" OnClick="Calc.Input.value += '+'"> <INPUT TYPE=button VALUE=" C" OnClick="Calc.Input.value = ''"><br> <INPUT TYPE=button VALUE=" 4" OnClick="Calc.Input.value += '4'"> <INPUT TYPE=button VALUE=" 5" OnCLick="Calc.Input.value += '5'"> <INPUT TYPE=button VALUE=" 6" OnClick="Calc.Input.value += '6'"> <INPUT TYPE=button VALUE=" -" OnClick="Calc.Input.value += '-'"> <INPUT TYPE=button VALUE=" (" OnClick="Calc.Input.value += '('"><br> <INPUT TYPE=button VALUE=" 7" OnClick="Calc.Input.value += '7'"> <INPUT TYPE=button VALUE=" 8" OnCLick="Calc.Input.value += '8'"> <INPUT TYPE=button VALUE=" 9" OnClick="Calc.Input.value += '9'"> <INPUT TYPE=button VALUE=" x" OnClick="Calc.Input.value += '*'"> <INPUT TYPE=button VALUE=" )" OnClick="Calc.Input.value += ')'"><br> <INPUT TYPE=button VALUE=" C" OnClick="Calc.Input.value = ''"> <INPUT TYPE=button VALUE=" 0" OnClick="Calc.Input.value += '0'"> <INPUT TYPE=button VALUE=" ." OnClick="Calc.Input.value += '.'"> <INPUT TYPE=button VALUE=" /" OnClick="Calc.Input.value += '/'"> <INPUT TYPE=button VALUE=" =" OnClick="Calc.Input.value = eval(Calc.Input.value)"> </TD></TR></TABLE> </FORM>

Celsius Fahrenheit Rechner

<!-- www.htmlopen.de --> <!-- Dieses HTML code wird gratis von htmlopen.de zur Verfügung gestellt www.htmlopen.de --> <script language="JavaScript"> <!-- // Celsius Fahrenheit Rechner function celtofar (form) { var temperatur = document.formx.f[0].checked ? 1 : 0 ||document.formx.f[1].checked ? 2 : 0; if (temperatur == 1){form.celsius.value = form.celsius.value + "°C = " + Math.round(form.celsius.value*1.8+32) + "°F" }; if (temperatur == 2) { form.celsius.value = form.celsius.value + "°F = " + Math.round((form.celsius.value-32)/1.8) + "°C" }; } // --> </script> <form name=formx> <TABLE BORDER cellpadding=3 cellspacing=0 align=center style="background-color:menu"> <TR><TD> <input type="radio" name="f" checked>°C  <input type="radio" name="f">°F <input type ="text" name="celsius">  <input type ="button" value=" Los " onclick="celtofar(this.form)"> *<input type ="reset" value=" Reset "> </TD></TR></TABLE> </form>

°C  °F   *

Formular nur mit Großbuchstaben

<!-- www.htmlopen.de --> <input type="text" size=20 onKeyUp="javascript:this.value=this.value.toUpperCase()"> Nur in Großbuchstaben: Nur in Kleinbuchstaben:

Fenster schliessen

<!-- www.htmlopen.de --> <a href=”javascript:self.close();”><b>Schliessen</b></a> Schliessen

Popup

<!-- www.htmlopen.de --> <script language=”javascript”> <!-- function centrerpopup (page,largeur,hauteur,options) var top=(screen.height-hauteur)/2; var left=(screen.width-largeur)/2; window.open (page,””,”top=”+top+”, left=”+left+”, width=”+largeur+”,height=”+hauteur+”,”+options);} //--> </script> <a href='javascript:centrerpopup(“popup.html”,310,480,”menubar=no,scrollbars=no,statusbar=no”)'>Popup</a> Popup

Frame Killer

<!-- www.htmlopen.de --> <script language="JavaScript"> <!-- if(top.frames.length > 0) top.location.href=self.location; //--> </script>

Frame Maker

<!-- www.htmlopen.de --> <script language="JavaScript"> <!-- if(top.frames.length < 1) top.location.href="frameset.htm"; //--> </script>

Alert Meldung

<!-- www.htmlopen.de --> <SCRIPT LANGUAGE="JavaScript"> <!-- window.alert("Hallo Welt!") // --> </SCRIPT>

Umleitung

<!-- www.htmlopen.de --> <head> <script language="javascript" type="text/javascript"> <!-- // JavaScript-Bereich fuer aeltere Browser auskommentieren window.location.href = 'https://www.htmlopen.de'; // --> </script> <meta http-equiv="refresh" content="0;URL=https://www.htmlopen.de"> </head>

Letzte Änderung

<!-- www.htmlopen.de --> <SCRIPT LANGUAGE="JavaScript"> <!-- // modDate = document.lastModified Tag=modDate.slice(3,5); Monat=modDate.slice(0,2); Jahr=modDate.slice(6,10); modDate="Letzte Änderung am" + Tag + ". " + Monat + ". " + Jahr + "."; document.write(modDate); // --> </SCRIPT>

Datum der Datei

<!-- www.htmlopen.de --> <SCRIPT LANGUAGE="JavaScript"> <!-- // buildDate = document.fileCreatedDate Tag=buildDate.slice(3,5); Monat=buildDate.slice(0,2); Jahr=buildDate.slice(6,10); buildDate="Datei Erstellt am" + Tag + ". " + Monat + ". " + Jahr + "."; document.write(buildDate); // --> </SCRIPT>

Goto zu einer bestimmten Position

<!-- www.htmlopen.de --> <script language="JavaScript"> <!-- function Goto() { window.scrollTo(0,500) } //--> </script> <a href="Javascript:Goto()">Scrolle Horizontal (0 Pixel) & Vertikal (500 Pixel)</a> Scrolle Horizontal (0 Pixel) & Vertikal (500 Pixel)

Color Picker

Wer kennt nicht den Kampf mit den hexadezimalen Farbcodes in HTML? Viele Editoren bieten heutzutage die Möglichkeit, Farbcodes komfortabel auszuwählen, aber was tun wenn man gerade nichts als den Notepad zur Hand hat? Der Color Picker hilft!

Einfach ein Farbfeld anklicken, der Hexwert und dezimaler Wert wird im folgenden Feld angezeigt.

Hexwert	Dezimaler Wert