Software - Jscript - Bilder VirtualUniversity

DIENSTE

	Newsletter abonnieren
	Sag's einem Freund!
	VirtualUniversity als Startseite
	Zu den Favoriten hinzufügen
	Feedback Formular
	e-Learning für Lehrer
	Spenden
	Autoren login

KURSE SUCHEN

Kurse veröffentlichen

Suche nach Datum:

Suche mit Schlüsselwort:

Suche nach Land:

Suche nach Kategorie:



	PARTNER



ausbildung24.ch - Ausbildungsportal, Seminare, Kursen... www.ausbildung24.ch >> HTMLopen.de - Alles was ein Webmaster braucht www.HTMLopen.de >> PCopen.de - PC LAN Netze und Netzwerke - alles was ein IT Profi und Systemtechnicker braucht www.PCopen.de >>

TELEKOM

Zurück

Javascript: Animationen

Buttons
Einige Buttons mit JavaScript-Funktionen.

Seite Ausdrucken
Mit einem Klick können Sie diese Seite ausdrucken.

Seite Speichern

Seite Öffnen
Mit diesen Button können Sie eine Datei öffnen.

Ein Button wird zum Link (Linkbutton). Normaler Linkbutton
<input type="button" value="Gehe zu Miniscripte 1" onclick="location='miniscripte.htm'">

Linkbutton in Frames

Download & Play Button

eMail Button

eMail Button mit Textvorbelegung

<pre><input type="button" value="eMail an einen Freund schreiben" 
                                     onclick="parent.location='mailto:?Subject=Startseitenempfehlung&Body=Hallo, 
                                     ich habe eine tolle Seite mit vielen erstklassigen Javascripts und vielen nützlichen 
                                     Tipps, Tricks und Informationen gefunden. Die URL lautet https://www.virtualuniversity.ch  
                                     Schau doch mal dort vorbei. Es lohnt sich! Mit freundlichen Grüßen'"></pre>
                                                         
                                                         <div align="center"> 
                                                           <input onClick="parent.location='mailto:?Subject=Startseitenempfehlung&Body=Hallo, ich habe eine tolle Seite mit vielen erstklassigen Javascripts und vielen nützlichen Tipps, Tricks und Informationen gefunden. Die URL lautet https://www.virtualuniversity.ch  Schau doch mal dort vorbei. Es lohnt sich! Mit freundlichen Grüßen'" type="button" value="eMail an einen Freund schreiben" name="button">
                                                         </div>
                                     
                                                         <p>  
                                     
                                     
                                     
                                                         <h4> </h4>
                                                         <p> </p>
                                                         <b>Linkbutton als Lokaler Verweis </b>
                                     <br>
                                     <textarea cols=60 rows=10>
                                                           <pre><a name="oben">
                                     ...
                                     ...
                                     <input type="button" value="Gehe nach Oben" onclick="location='#oben'">
                                     </pre>
                                                          
                                                         <div align="center"> 
                                                           <input onClick="location='#oben'" type="button" value="Gehe nach Oben" name="button">
                                                         </div>
                                     
                                     
                                     
                                     
                                     
                                                         <h4> </h4>
                                                         <p> </p>
                                                         Quelltext-Button 
                                     <br>
                                     <textarea cols=60 rows=10>
                                                           <pre> <input type=button value="Quelltext anzeigen"
                                      onClick= 'window.location = "view-source:" + window.location.href'>
                                     </pre>

Fenstergröße ändern
Die Fenstergröße lässt sich mit einem Klick auf den Button ändern.
Funktioniert nicht bei Frames!

Rahmen entfernen
Die gestrichelten Rahmen lassen sich ganz leicht entfernen.
Anwendbar auf Textlinks, Bilder mit Links, Imagemaps, ...

mit Rahmen

ohne Rahmen

Confirm

Testen Sie mal diesen Button.

Text markieren

Text markieren und in die Zwischenablage kopieren [IE]

Zwischenablage auslesen
Text aus der Zwischenablage einfügen

Button mit wechselnder Beschriftung

Eingabe überprüfen

Sendebutton mit Sicherheitsabfrage

Tasteneingaben Zählen
Bei manchen Formularen ist es wichtig die Textlänge zu begrenzen.

<pre><script language="JavaScript">
                                      
                                     </script>
                                     
                                     <Form name="Form">
                                      Sie haben noch: 
                                      <input type="text" name="Anzahl" size="3" maxlength="3" readonly>
                                      Zeichen<br>
                                      <textarea rows="5" 
                                       cols="35" onChange="CheckLen(this)" 
                                       onFocus="CheckLen(this)" onKeyDown="CheckLen(this)" 
                                       onKeyUp="CheckLen(this)" wrap="VIRTUAL" >
                                      </textarea>
                                     </form></pre>

Klick mich
Beim Klicken des Buttons verschiebt er sich jeweils einen
halben Zentimeter nach unten und nach rechts.

Mit Klick markieren.
Mit einem Klick können sie den Text im Textfeld markieren.

Meldung mit Format.
Formatiert wird die Ausgabe(der Text) mit: \t = Tabulator; \r = Return (oder \n)

Wertübergabe in Javascript

<pre><script languange="JavaScript">
                                      
                                     </script>
                                     
                                     <input type=button value="Button 1" onClick="Test('EINS')">
                                     
                                     <input type=button value="Button 2" onClick="Test('ZWEI')"></pre>
                                     <textarea>
                                                         
                                     
                                     <script languange="JavaScript">function Test2(Name){alert("Sie haben Button " + Name + " gedrückt")}</script>
                                     
                                     
                                                         <div align="center"> 
                                                           <input onClick="Test2('EINS')" type="button" value="Button 1" name="button">
                                                           * 
                                                           <input onClick="Test2('ZWEI')" type="button" value="Button 2" name="button">
                                                         </div>
                                     
                                     
                                     
                                     
                                                         <h4> </h4>
                                                         <p> </p>
                                                         <b>Eingabefeld fokusieren</b> 
                                                         <br>
                                     
                                                           Beim Laden der Seite wird das Eingabefeld fokusiert. 
                                     <br>
                                     <textarea cols=60 rows=10>
                                                           <pre><body onLoad="document.Feld.Eingabe.focus()">
                                     
                                     <form name="Feld">
                                      <input type="text" name="Eingabe">
                                     </form></pre>

Autom. Eingabe-Check
Der eingegebene Wert wird direkt nach dem Tastendruck überprüft.
Liegt der eingegebene Wert in diesem Beispiel unter 101, wird er akzeptiert.
Ist der Wert über 100 wird die Eingabe korrigiert.

Button mit Doppelklick

Beispiel:

Auswahl überprüfen

<pre><script languange="JavaScript">
                                      
                                     </script>
                                     
                                     <form name="Formel2">
                                      <select name="Auswahl" size=3>
                                       <option value="Salz"> Salz
                                       <option value="Mehl"> Mehl
                                       <option value="Zucker"> Zucker
                                      </select>
                                     
                                     <input type=button value="Meine Auswahl" onClick="Test()">
                                     </form></pre>

Button Zähler

Checkbox und Radiobuttons mittels JavaScript überprüfen.

Beispiel:

1
2

Sound bei Link-Klick
Beim Klicken auf dem Link wird ein Sound abgespielt.
Das JavaScript funktioniert nur beim öffnen eines neuen Fensters, in Frames oder in IFrames.

Seitenwechsel bei Tastendruck
Auf Tastenruck zu einer anderen Seite surfen.
Die Zahl "50" (im Beispiel: Taste == 50) ist der Ascii-Wert für 2 und die Zahl "51" für 3.
Einen Überblick der Ascii-Codes finden Sie in der » Ascii Tabelle.

Beispiel: Miniscripte 2 / Miniscripte 3

Checkboxen selektieren beim anklicken von Text

Beispiel:

Testtext 1
Testtext 2

Testtext 3
Testtext 4

Text bei Mouseover ändern

Dieser Text ändert sich beim überfahren mit der Maus.

Klick-Doppelklick Button Der folgende Button ändert die Farbe beim klicken b.z.w. beim doppelten klicken.

Menü der Webseite in der Suchleiste des Browsers anzeigen

Beispiel: Mein Menü

Auswahl überprüfen

<pre><script languange="JavaScript">
                                      
                                     </script>
                                     
                                     <form name="auswahl">
                                      <input type=radio name="vote"> Geld
                                      <input type=radio name="vote"> Auto
                                      <input type=radio name="vote"> Glück
                                      <input type=button value="Meine Wahl!" onClick="Check()">
                                     </form>
                                     </pre>

Objekte Anzeigen / Verstecken
Buttons, Texte, Bilder etc. können auf Klick angezeigt oder versteckt werden.

<pre><input type="button" value="Buttons:"
                                      onclick="if(document.getElementById('hallo').style.<span style="BACKGROUND-COLOR: cornsilk">visibility</span>=='<span style="BACKGROUND-COLOR: cornsilk">hidden</span>')
                                      document.getElementById('hallo').style.<span style="BACKGROUND-COLOR: cornsilk">visibility</span>='<span style="BACKGROUND-COLOR: cornsilk">visible</span>';
                                      else document.getElementById('hallo').style.<span style="BACKGROUND-COLOR: cornsilk">visibility</span>='<span style="BACKGROUND-COLOR: cornsilk">hidden</span>'">
                                     
                                     <span id="hallo" style="<span style="BACKGROUND-COLOR: cornsilk">visibility: hidden</span>">
                                      Uhrzeit eingeben:
                                      <input type="text" size="10"> 
                                      <img src="Bild.gif" onClick="alert('Wer hat an der Uhr gedreht ? ...')">
                                     
                                     </span>
                                     </pre>

Beispiel: Uhrzeit eingeben:

visibility: visible = Anzeige
visibility: hidden = Nichtanzeige mit Platzhalter

display: block = Anzeige
display: none = Nichtanzeige ohne Platzhalter

Mit Doppelklick zurück
Wird diese Seite mit der linken Maustaste doppelt angeklickt,
zeigt der Browser die vorherige Seite an.

Zurück

DIPLOMARBEITEN UND BÜCHER

Diplomarbeiten zum Runterladen:

Architektur / Raumplanung
Betriebswirtschaft - Funktional
Erziehungswissenschaften
Geowissenschaften
Geschichtswissenschaften
Informatik
Kulturwissenschaften

Medien- und Kommunikationswissenschaften
Medizin
Psychologie
Physik
Rechtswissenschaft
Soziale Arbeit
Sozialwissenschaften

	JOBS