Skip to content

freiesMagazin für 12/2014 erschienen

Heute ist die Dezember Ausgabe (12/2014) vom freiesMagazin erschienen,
hier mal ein kurzer Überblick über die Themen, die Ausgabe könnt ihr über den oberen Link in verschiedenen Versionen downloaden.

Inhalt der Ausgabe
* Ubuntu und Kubuntu 14.10
* State of the Commons – Zustand der Creative-Commons-Lizenzen
* Der November im Kernelrückblick
* Git-Tutorium – Teil 1
* Shellskript podfetch – Podcasts automatisch herunterladen
* Broken Age
* Eine Einführung in Octave
* Ubucon 2014 in Katlenburg-Lindau
* Interview mit den Musikpiraten
* Rezension: Schrödinger lernt HTML5, CSS3 und JavaScript
* Rezension: Java – Eine Einführung in die Programmierung
* Die dritte Katastrophe – Teil 2
* FAQ zum siebten freiesMagazin-Programmierwettbewerb
* Leserbriefe und Veranstaltungen


freiesMagazin für 03/2014 erschienen

Heute ist die März Ausgabe (03/2014) vom freiesMagazin erschienen,
hier mal ein kurzer Überblick über die Themen, die Ausgabe könnt ihr über den oberen Link in verschiedenen Versionen downloaden.

Inhalt der Ausgabe
* Kurzvorstellung: elementary OS
* Pinguine haben kurze Beine – Die Laufzeiten der Linuxdistributionen
* Der Februar im Kernelrückblick
* WLAN-AP mit dem Raspberry Pi
* Scratch-2-Tutorial
* Präsentationen mit HTML und reveal.js
* Roll'm Up - Ein altes Flipperspiel neu entdeckt
* Spielend programmieren: Interview mit Horst Jens
* Rezension: Schrödinger programmiert Java
* Rezension: Wien wartet auf Dich! – Produktive Projekte und Teams
* Leserbriefe und Veranstaltungen

Smilies in ein Textfeld einfügen

Es gibt so viele Seiten, auf denen ein Klick auf ein Smilie genügt, um den Code für diesen in ein Textfeld einzutragen. Sie wollen das auch? Dann sollten Sie sich mal dieses Tutorial anschauen.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <script type="text/javascript">
      <!--
       function setsmile(smilie)
       {
         document.formular.textfeld.value += smilie+" ";
         document.formular.textfeld.focus();
       }
     //-->
    </script>
    <title>Smilies einfügen</title>
  </head>
  <body>
    <form name="formular" method="post">
      <a href="javascript:setsmile(':aha:')">
        <img border="0" src="images/smilies/1.gif">
      </a>
      <a href="javascript:setsmile(':-(')">
        <img border="0" src="images/smilies/2.gif">
      </a>
      <a href="javascript:setsmile(':-)')">
        <img border="0" src="images/smilies/3.gif">
      </a>
      <a href="javascript:setsmile(';-)')">
        <img border="0" src="images/smilies/4.gif">
      </a>
      <textarea name="textfeld"></textarea>
      <br />
        <input name="Absenden" type="submit" value="Abschicken" />
    </form>
  </body>
</html>


<!//–>

Wenn Ihr Browser kein JavaScript versteht oder es abgeschaltet wurde, wird alles dazwischen als Kommentar angesehen

setsmile(smile)
Dies ist der Name der Funktion mit Platzhalter. Wenn nun <
document.formular.textfeld.value += " “+smile+" "

Wenn man einen Link anklickt der die JS-Funktion aufruft, wird der Wert in das Textfeld des dazugehörigen Formulars eingetragen. Durch das " " vor und nach +smile+ wird ein Leerzeichen for dem Smiliecode ausgegeben.

----

Quelle: Scripting-Base
Die Quelle beinhaltet nur noch ein Portfolio, die ursprünglichen Tutorials sind dort nicht mehr zu finden.

XHTML konforme Seite

Immer mehr Inhaber von Webseiten setzen auf den Web-Standard XHTML. Sie müssen nur ein paar Tags umschreiben, denn die Dateiendung .html kann bestehen bleiben. Wie Sie eine konforme Seite schreiben, zeigt dieses Tutorial:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Seitentitel</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <link rel="shortcut icon" type="images/x-icon" href="favicon.ico" />
    <meta name="title" content="Name der Seite" />
  </head>
  <body>
      Paragraphen müssen
      geschlossen werden: <p></p>
      Nicht geschlossene Tags werden
      in sich selbst geschlossen:
    <img src="bild.gif" alt="Bild" /> <br />
  </body>
</html>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Das DOCTYPE muss immer beim HTML-Code an oberster Stelle stehen, die Zeile ist fest definiert und kann z.B. aus der Dokumentation von SelfHTML geholt werden.

<html xmlns="http://www.w3.org/1999/xhtml">

Wenn XHTML verwendet wird muss statt das obige Beispiel stehen, sobald XHTML verwendet wird muss jeder Parameter in sich geschlossen werden, weil XML das so benötigt.

Im Endeffekt muss statt <br> wie bis HTML 4 folgendes geschrieben werden <br />

Hover-Effekt für Tabellen

Es gibt sie in Foren, Blogs und in der Scripting-Base: Den Hover-Effekt an Tabellen.
Dies ist zwar mit CSS auch möglich, jedoch funktioniert dass nicht in allen Browsern, mit einem simplen JavaScript funktioniert es überall (sofern JavaScript aktiviert ist).

<table>
  <tr onmouseover="this.style.background='#C0C0C0';" onmouseout="this.style.background='#FFFFFF'; this.style.cursor='default';">
    <td>Zeile 1</td>
  </tr>
  <tr onmouseover="this.style.background='#C0C0C0';" onmouseout="this.style.background='#FFFFFF'; this.style.cursor='default';">
    <td>Zeile 2</td>
  </tr>
  <tr onmouseover="this.style.background='#C0C0C0';" onmouseout="this.style.background='#FFFFFF'; this.style.cursor='default';">
    <td>Zeile 3</td>
  </tr>
</table>


Durch onmouseover wird dem Browser eine Anweisung übergeben, wenn der Mauszeiger die Tabellenzeile überfährt. Hier wird mit this.style.background=’#C0C0C0′ die Farbe Grau übergeben. Somit wird der Hintergrund grau.
Genau das selbe passiert mit onmouseout. Hier wird der Hintergrund in weiß geändert, wenn der Mauszeiger die Tabellenzeile nicht mehr berührt.
Mit erweiterten CSS-Kenntnissen kann man noch gezielt die Cursor ändern.

----

Quelle: Scripting-Base
Die Quelle beinhaltet nur noch ein Portfolio, die ursprünglichen Tutorials sind dort nicht mehr zu finden.

Berechnen des Volumenstroms

Mit Hilfe dieses kleinen Javascripts könnt ihr den Volumenstroms eines Hydraulikkolbens berechnen, ohne das ihr laufend die Zahlen in den Taschenrechner oder im Kopfrechnen müsst ;-)

So es werden mittels document.getElementsByName("FELDNAME")[0].value der Wert entnommen und nach dem das Feld verlassen wurde wird onchange und damit der aktuelle Qmax-Wert in Liter pro Minute ermittelt.

<script type="text/javascript>

function calc_dim_2_liter ( )
{
 var diameter = document.getElementsByName("diameter")[0].value;
 var stroke = document.getElementsByName("stroke")[0].value;
 var qmax = 0;
 qmax = ((Math.PI*(diameter*diameter))/4)*stroke*0.000001*60;
 document.getElementsByName("qmax")[0].value = qmax.toFixed ( 5 );
}

</script>

<h3>Liter pro Minute nach Maßangaben</h3>
<input type="text" name="diameter" value="1" onchange="calc_dim_2_liter()" size="5" style="text-align: right;" /> mm Kolbendurchmesser<br />
<input type="text" name="stroke" value="1" onchange="calc_dim_2_liter()" size="5" style="text-align: right;" /> mm Hub<br />
<input type="text" name="qmax" size="5" readonly="yes" style="text-align: right;" /> l/min Qmax