Beiträge von Basi

  • Variable ID - jQuery Mask Plugin

    Wenn du uns noch verrätst auf welchen Ebenen die beiden Codes ausgeführt werden (Global, in einer Funktion, etc.) dann ist die Hilfe etwas einfacher möglich. Es erschließt sich nicht besonders gut wie die beiden Codes in Zusammenhang stehen.

  • Problem mit "onclick" bei DOM erweiterung

    Ich habe an deinen Code von oben das Gleiche angehängt wie du:

    Und bei mir sieht das im Firefox so aus:
    html-seminar.de/woltlab/attachment/608/

    onFocus kann nicht angezeigt werden, wir haben das Attribut nicht hinzugefügt, JavaScript überwacht das Event jetzt persönlich ;)

  • Problem mit "onclick" bei DOM erweiterung

    Herzlich willkommen in der Welt von JavaScript ;)

    Dein erstes Problem mit dem required Attribut ist kein wirkliches Problem, das Attribut wird gesetzt, jedoch nicht ausgefüllt, mit HTML5 ist das ausfüllen auch nicht nötig (wie das vorher war weiß ich derzeit nicht):

    HTML
    <!-- Quelle: w3schools -->
<input type="text" name="usrname" required>


    Jedoch einfahc um es zu erwähnen: Du könntest nachdem du mit appendChild die Elemente angehängt hast einfach setAttribute nutzen:

    JavaScript
    document.getElementById(legungName).setAttribute("required", "required");


    Dein 2. Problem ist etwas komplexer aber mit einem einfachen Trick auch gelöst. Event-Listener an nachträglich erstellte DOM Elemente anhängen geht nicht einfach über das Einfügen in den HTML Code. Auch hier warten wir bis das Element mit appendChild angehängt wurde und nutzen dann die Funktion addEventListener:

    JavaScript
    document.getElementById(legungName).addEventListener("focus", function() { 
  updateLegung(m);
});


    Der eigentliche Aufbau wäre:

    JavaScript
    element.addEventListener(TYPE, LISTENER [, useCapture, wantsUntrusted]);


    Wenn wir jedoch Werte an eine Funktion übergeben wollen müssen wir dies in einer anonymen Funktion tun, ansonsten wird der LISTENER ausgeführt sobald addEventListener ausgeführt wird.

    JavaScript
    // Wir erhalten sofort eine Alert Box mit dem Inhalt 1
element.addEventListener("click", alert(1));


    Der Aufbau einer anonymen Funktion ist immer:

    JavaScript
    function() {
  // Code
}


    Ich hoffe deine Fragen sind beantwortet, ansonsten melde dich gerne wieder :love:

  • Social Media Icons (zum Download)

    Heute schwirrten in meinem Kopf irgendwie Gedanken bezüglich Social Media Icons umher. Ich habe mich mal vor Google geklemmt und ein wenig gesucht, dabei fielen mir einige Dinge auf:

    • Es gibt unzählige individuelle Icons
    • Viele Icons sind sehr pompös gestaltet, sie sollen scheinbar herausstechen, verlieren dabei jedoch ihren eigentlichen Nutzen als Icon, es werden eher Artworks
    • Das Gegenteil, also die schlichten Icons, sind dagegen meist extrem einfach gehalten und wirken irgendwie langweilig
    • Ist man auf der Suche nach einem ganzen Set an Icons so schränkt sich die Auswahl erstaunlich weit ein; Die meisten Icons lassen sich alleine nutzen, besitzen jedoch kein Äquivalent anderer Netzwerke


    Da ich persönlich mir selbst immer relativ hohe Ziele stecke ärgert mich so etwas schnell, also muss ich selber ran und das habe ich in dem Fall auch gemacht. Mein Augenmerk lag auf dem was mich an allen anderen störte. Ich versuchte also die Charakteristik des jeweiligen Netzwerkes zu wahren, so schlicht wie möglich zu bleiben und dabei nicht ins Langweilige abzurutschen.

    Ich freue mich über konstruktives Feedback (wenn du meine Icons "kacke" findest darfst du das für dich behalten, interessiert eh niemanden).

    Bisher angefertigt: YouTube, Facebook, Twitter, Google+, Instagram, Tumblr, Snapchat und RSS. Wir brauchen uns nicht darüber unterhalten ob RSS Feeds ein soziales Netzwerk sind oder nicht, sie gehören mit zu dieser Serie.
    Sollte ich ein Netzwerk außen vor gelassen haben welches du unbedingt brauchst darfst du dich auch gerne hier melden, das lässt sich (unter Umständen mit etwas Geduld) sicher einrichten.

    Ich verzichte darauf für jedes Icon eine zweite Datei anzulegen um einen hover Effekt darzustellen, wir befinden uns kurz vor der Einführung des Web 3.0 als Standard und können dies zum Beispiel mit Transparenz lösen.

    Das Ergebnis möchte ich unter folgenden Restriktionen teilen: Ich gebe die Icons insofern frei das sie ohne Namensnennung verwendet, nicht geändert, nicht als eigenes Werk ausgegeben und nicht eigenständig verbreitet oder neu hochgeladen werden dürfen. Ich verzichte auf CC-Lizenzen oder ähnlichen Schnickschnack da ich das für überflüssig halte, theoretisch darf weder ich die Icons verändern, noch du die Icons in veränderter Form zum verlinken auf deiner Seite nutzen.
    Das ist die Gesetzeslage und da kann man nichts dran ändern. Dieser Fakt hat jedoch eher wenig Gewicht, weder sind Präzedensfälle bekannt noch gehe ich davon aus das irgendwer von uns deswegen abgemahnt wird, dafür ist es mittlerweile auch zu spät bei der breiten Masse an veränderten Icons.

    Mediafire
    Dark32 / Dark64
    Light32 / Light64
    html-seminar.de/woltlab/attachment/603/html-seminar.de/woltlab/attachment/602/

  • Problem beim Bestellen der Kurs-DVD's

    Wir können hier im Forum leider keinen Rechnungssupport bieten. Die Geschichte klingt jetzt mehr als unglaubwürdig. Im Normalfall werden die Videos verschickt und sind nicht zur Abholung bestimmt (da gibt es sicher Ausnahmen welche dann besprochen werden). Man schreibt "diese Person" auch nicht einfach an sondern nutzt die dafür vorgesehenen Formulare (HTML&CSS/PHP&MySQL).
    Sollte eine Abholung mit Axel Pratzner abgesprochen sein so wird diese von ihm auch eingehalten oder entsprechend abgesagt, sollte Kontakt über E-Mail oder Ähnliches bestehen so wird dieser auch aufrecht erhalten, es wird nicht dazu kommen das einfach keine Antwort mehr gesendet wird, es kann sich höchstens mal 1-2 Tage verzögern wenn viel zu tun ist.

    Wenn dein Bekannter ein Problem hat darf er sich auch gerne persönlich an uns wenden, das würde die Sache deutlich einfacher machen.

    Wenn er später im Berufsfeld Webdesign arbeiten möchte bietet sich bestenfalls eine Ausbildung oder ein Studium in die Richtung an. Englischkenntnisse sind dafür wichtiger als man im ersten Moment denken würde, dazu muss ich sagen das Praxisvideos auf YouTube in den seltensten Fällen fortgeschrittenes Englisch voraussetzen.

  • bei Google auf die 1.Seite

    Das der Begriff "optimale Suchmaschinenoptimierung" auf einer Seite mit dem Thema SEO (Search Engine Optimization, z.Dt. Suchmaschinenoptimierung) vorkommt sollte niemanden verwundern, ich verstehe deine Aussage von daher nicht wirklich.

    Deinen Beitrag mit dem 32-seitigen (+weiterführend) SEO Guide vom Anbieter der bekanntesten Suchplattform im Internet zu vergleichen ist schon etwas unverschämt.

    Um aber direkt Bezug zu nehmen:

    Google Bilder, Python Fachwerk: Ich sehe in erster Linie Bilder einer schweizer Internetpräsenz die offenbar von einer Schule für Physik betrieben wird
    Google Bilder, openstreetmap manhattan: Zeigt mir auf der gesamten ersten Seite nur englische und russische Resultate welche offensichtlich nicht von dir stammen
    Youtube, openstreetmap: Wozu reicht der Begriff? Ich weiß nun wer Kai Sackmann ist und irgendwie ist er mir sympathisch

    In der Praxis hat deine Methode also nicht funktioniert, selbst bei mir nicht und ich habe mich die Tage bereits durch deine Werke im Internet geklickt, somit müsstest du in meinem Profil aufgeführt und zumindest in irgendeiner Weise gelistet sein, bist du aber nicht.

    Wer über Google gefunden werden möchte muss in den meisten Fällen schon mehr bieten als 2 individuelle Suchbegriffe, was genau lese man bitte wie bereits erwähnt hier nach.
    Das du deine eigenen Werke präferiert angezeigt bekommst ist kein Wunder, das System dahinter erfährt man durch aufmerksames Lesen auch im SEO-Guide von Google.

  • Problem beim Bestellen der Kurs-DVD's

    Von welchem Kurs sprichst du, HTML&CSS oder PHP? Wenn das Formular korrekt ausgefüllt wurde werden die DVD's innerhalb weniger Tage an die angegebene Adresse verschickt, sollten die Angaben falsch sein kann der Kunde einfach eine E-Mail senden und bitten diese zu ändern.

    Probleme die auftauchen liegen in den seltensten Fällen beim Betreiber und wenn es doch dazu kommt wird dieser der Sache auf den Grund gehen und alles gerade bügeln.

    Was genau funktioniert denn nicht so wie du es dir vorstellst?

  • animated gif: Lizenz / Alternative

    Sofern du zufrieden bist ist doch alles gut? Theoretisch ließen sich die beiden Zahnräder auch als PNG mit transparentem Hintergrund speichern und dann per CSS drehen, letztlich bleibt es dir überlassen.

    Die Animation sieht übrigens auch mit der halben Anzahl der Frames noch relativ flüssig aus, das spart noch mal Dateigröße.

  • animated gif: Lizenz / Alternative

    Die Frage ist: Wer ist "jemand" und worauf stütz er diese These?

    Den Interpreter wird es kaum interessieren ob da nun ein div vor der Raute zu finden ist oder nicht, außer es handelt sich um eine Klasse welche für unterschiedliche Elemente unterschiedliche Werte besitzen soll. Wenn ich an der Ladegeschwindigkeit meiner Seite arbeite dann beginne ich nicht bei CSS sondern bei Grafiken, JavaScript und PHP Requests.

    Wenn ich mich dann dem CSS zuwende dann entferne ich sicher nicht die Tags der Selektoren bevor ich nicht...

    • verschiedene CSS Dokumente zu einem zusammengefügt
    • Kommentare, Leerzeilen und eventuell nicht genutzten Code, am Schluss auch die Umbrüche entfernt
    • das Dokument mit Hilfe von Archiven und PHP komprimiert

    ...habe.

    Für mich persönlich ist das Gesamtbild meines Stylesheets einfach deutlich übersichtlicher wenn ich so genau wie möglich angebe was ich selektiert haben möchte, gerade mit CSS3 sind da einige neue interessante Möglichkeiten aufgetaucht.

    Wir wollen jetzt nicht vom Thema in diesem Thread ablenken, meiner Meinung nach ist es Geschmackssache und interessiert nur in Ausnahmen (CSS Code von über 3-4.000 Zeilen sind eher selten) ansatzweise.

  • animated gif: Lizenz / Alternative

    Für die animierten technischen Zeichnungen eignen sich GIF-Animationen tatsächlich ganz gut, allerdings muss man etwas mit der Kompressionsrate spielen um den Mittelweg zwischen "Qualität" und Leistung (Dateigröße) zu finden.

    Bei den bunten animierten Kästchen rate ich von GIF-Bildern ab, die Beispielgrafik ist zu groß für das Format, Transparenz ist mit 256 Farben eher nicht so hübsch und ohne genug Abstufungen von Schwarz zu Weiß sehen die schrägen Kanten später aus wie gewollt und nicht gekonnt. Ich würde mich dort an deiner Stelle auf die Grafikengine der modernen Browser verlassen, hierzu habe ich mal ein reines HTML und CSS Beispiel erstellt: http://jsfiddle.net/WktU4/
    Wenn das Ganze nicht funktioniert, kann es sein das du einen etwas älteren Browser nutzt, ändere dies oder füge das entsprechende Präfix der CSS3 Befehle transition und transform im CSS Code hinzu, für mehr Infos siehe hier.

    Ein Nachteil ist der Aufwand beim erstellen. Solange es nur kästchen sind die sich drehen, ihre Größe ändern oder sich in Farbe/Transparenz anpassen ist alle gut, sobald es zu Dreiecken oder Kreisen kommt benötigst du dafür Canvas (Kreise könnte man mit runden Ecken auch so darstellen). Coden ist eben auch noch wieder etwas mehr Aufwand als in einem Grafikprogramm animieren, jedoch machst du den Eindruck als wärest du sowieso eher der Coder ;)
    Außerdem muss mit CSS immer eine Mausinteraktion stattfinden um die Animation zu starten, ich persönlich finde das nicht schlecht da in diesem Fall das Auge nicht direkt abgelenkt wird sondern der Besucher erst interessiert den Text liest, dies ließe sich mit einem einfachen JavaScript jedoch umgehen.
    Wenn du tatsächlich zu dieser Methode greifen möchtest kannst du dich gerne noch einmal melden falls du Hilfe benötigst, ich weiß jedoch nicht einmal ob du mit HTML und CSS vertraut bist?

  • Politik ist nicht jedermanns Sache...

    Ich würde gerne meine Meinung schreiben.. nur worüber? Inhalt finde ich nicht viel, wobei mir auffällt das die Seite herzlich wenig bringt wenn ich zu den Inhalten welche vorhanden sind nicht mal meine Meinung schreiben darf (in Form einer Kommentarfunktion z.B.), denn Politik ist (wie von MagBen angemerkt) jedermanns Sache und beruht nicht nur auf deiner Meinung, etwas anderes beinhaltet die Seite am Ende aber nicht. Du wirst unmöglich unparteiisch zu jeder Partei Konstruktive Texte verfassen können, das ist alleine einfach nicht sinnvoll.

    html-seminar.de/woltlab/attachment/596/html-seminar.de/woltlab/attachment/595/Zum Design etwas zu sagen ist immer sehr heikel, erst kürzlich haben wir hier wieder diskutiert das es ja Ansichtssache ist aber trotz allem einige Grundsätze gibt die man beachten sollte, dazu zählen zum Beispiel farbige Hintergründe bei Texten, das geht einfach nicht und auf kaum einer adäquaten Internetseite wirst du den Hauptinhalt auf farbigem Hintergrund entdecken (Stichwort: Lesbarkeit / Kontrast). Weiß auf Hellgrün geht dann komplett in die Hose (was man bei dem kleinen der beiden Ausschnitte nicht sehr gut erkennen kann, Glück gehabt ^^ ).

    Ich zähle mal die Farben: Ein bläuliches Grau, ein Bild mit schlecht lesbarer, beinahe neongrüner Schrift, Weiß auf Grün mit einer Prise Knallrot, die nächste Überschrift ist dann nicht mehr weiß sondern schwarz, schafft auf jeden Fall eine Interessante Struktur, blaue Verweise, die besuchten sind Lila, die aktuelle Seite ist schwarz hervorgehoben und alles findet sich auf einem meiner Ansicht nach billigen Grün mit weiß/grauen Rändern.
    Das Gesamtergebnis bezeichne ich liebevoll als "Cartoon-Stil" der jedoch tierisch in die Hose ging. Nicht zu knapp abgerundete Ecken, dicke Balken, knallige Farben und alles in allem nicht sonderlich schön anzusehen. Auch abgesehen von dieser eher subjektiven Einschätzung ist die Farbwahl nicht sonderlich nett zu jedem Auge welches interessiert längere Artikel lesen möchte.

    Wenn man die Elemente mit einem Gitternetz erweitert, erkennt man schnell die fehlende Symetrie, welche bei zentrierten, schmalen Layouts doch recht wichtig ist. Der Kopfbereich ragt auf der rechten Seite zu diesem Zeitpunkt weiter hinaus als auf der linken, die Navigation ragt auf der linken Seite über den Newsticker hinaus, der Inhaltsbereich (wenn auch nur 1px) ragt auf der rechten Seite hinaus. Der Fußbereich passt zum Newsticker und damit weder zur Navigation, noch zum Inhalt oder dem Kopfbereich.

    Die Formatierung deiner Texte ist auch nicht diejenige welche sich am Besten lesen lässt. Keine Unterüberschriften, kaum Absätze, keine kurze Ablenkung für das Auge (Bilder im Fließtext, Trennstriche zum abgrenzen von Absätzen oder Überschriften, kein farblicher Kontrast). Ich bin nicht der Experte für die beliebten Kommata, ich setze oft zu viele und oft zu wenige, deine Texte jedoch sollten seriös wirken und sollten von daher auch korrekt geschrieben sein, sind sie nicht.

    Zitat

    Videoformat oder MIME-Typ wird nicht unterstützt.


    Schade ;(

    Ich möchte dir zu verstehen geben das hier wenig Anhaltspunkte für Kritik zu finden sind, was genau ist der Sinn deiner Seite, was möchtest du uns präsentieren? Inhalt hast du nicht vorzuweisen, dein Design ist nichts Außergewöhnliches, eher langweilig und dein Quellcode ist nicht valide. Invalider Code ist dein erster Ansatzpunkt, wenn du für Designtechnische Kritik offen bist kannst du meinen oben stehenden Text durchdenken (auch wenn er etwas harsch geschrieben ist, das tut mir leid ich bin nicht bei bester Laune) und Inhalte solltest du so langsam zusammentragen, oder du verrätst uns das du keine Kritik zu Inhalten willst, kann ich verstehen ist auch eher Nebensache hier im Forum, jedoch musst du uns mitteilen was genau du bewertet haben möchtest, einen Gesamteindrudck vermittelt eine Seite ohne Inhalt nun mal nicht.

    Ohne dein PS würde dein Beitrag übrigens schon als Werbung gelten, wir sind jedoch ein Forum das sich für die Technik interessiert:

    Zitat von Nutzungsbestimmungen
    • Beiträge, die nur zur Eigenwerbung dienen, werden als SPAM angesehen und können nach dem Ermessen des Moderators bzw. Administrators geändert/gelöscht werden. [...]