Javascript

Bin gerade wieder dabei mit Javascript anzufangen. Ich hatte ja schon mal damit begonnen, aber dadurch, dass ich über einen längeren Zeitraum hinweg aufgehört hatte zu lernen, muss ich nun wieder von vorn beginnen, weil ich mittlerweile alles vergessen habe 😀 … wobei das nicht schlimm ist, weil ich damals nur Übungen zu den Variablen und Arrays gemacht hatte:

Javascript Zusammenfassung

Ich war nicht weit gekommen, daher ist dies nicht wirklich schlimm^^
Doch da wir im März mit Javascript beginnen, möchte ich zumindest ein bisschen etwas davon können. Mal schauen wie weit ich komme^^

Buttons

Am Wochenende hatte ich ein paar Buttons angefertigt, die mittels Hovereffekt Farbe wechseln-, eine Überschrift sichtbar machen- und gleichzeitig nach oben springen sollen. Heute werde ich sie testen und gucken, ob man noch zusätzlich einen Gloweffekt anbringen kann. Ich bin schon gespannt darauf und hoffe natürlich, dass sie auch gut aussehen werden. Nur schade, dass mein geliebter ❤ Hovereffekt auf Smartphones und Co. nicht sichtbar ist, doch darauf sche*** ich jetzt mal, weil wichtig ist mir momentan mal die Desktopseite. Der Rest wird dann angepasst.

Marathon xD

Ich hab einen programmier-Webdesign-Marathon hinter mir 😀
DO: 23:00 Uhr – 04:00 Uhr
FR: 20:00 Uhr – 04:00 Uhr
SA: 10:00 Uhr – 05:00 Uhr
SO: 12:00 Uhr – 07:00 Uhr

…es macht (leicht) süchtig! xD 0.o

Lol, das war wieder was, doch ich bin mit dem Ergebnis zufrieden, irgendwie brauchte ich ewig für die Optik, ich konnte mich nicht entscheiden. Am Ende hatte ich den Menü-hover-Banner entfernt und ein cooles, animiertes Menü eingefügt. Der Banner hingegen verfügt nun über einen Hovereffekt, bei dem das 2. Bild über dem 1. Bild langsam eingeblendet wird. Es sieht cool aus, die Arbeit hat sich gelohnt 🙂

Die 2. Seite konnte ich nicht ganz fertigstellen, doch ich habe buttons und einen Entwurf angefertigt, sodass ich gegebenenfalls heute gleich loslegen könnte. Ich freue mich schon! 🙂

Yeah!

Hahaaaaaaaa, wie geil!

Mit den heutigen Übungen im Kurs konnte ich endlich verstehen wo mein Fehler im html lag. Ich hatte ja in all meinen Seiten immer das Problem, dass mir häufig CSS-Befehle nicht angenommen wurden und irgendwie war niemanden so klar wo das Problem lag.
Da ich heute wieder leicht am Ausrasten- und nahe dran war den PC anzuschreien, rief ich unseren Trainer zurate. Auch er war anfangs ratlos, doch nach ein paar Minuten hatte er die Lösung. Das Problem lag an diesem Befehl im Kopfbereich:

<link href="style.css" rel="stylesheet" type="text/css">

Der schlussendlich so lauten musste:

<link href="style.css" rel="stylesheet">

Boa ey, jetzt kann ich echt all meine Seiten umschreiben, ABER ich hab endlich verstanden was ich ändern muss!
…noch 3 Tage und ich hab Urlaub :D…da gehts dann ab! Gehege bauen und htmllllllllllln ;-P =)

UND ….EIN NEUER PC MUSS HER!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

und…gameguruuuuun!!!

Responsive Design

Ich bin schon das ganze Wochenende dabei eine neue Website zu erstellen. Optisch gefällt sie mir sehr gut, trotzdem habe ich Probleme meine Idee in „Responsive“ umzusetzen. Das nervt mich tierisch, weil ich ansonsten voll zufrieden wäre. 
Wahrscheinlich lässt sich mein Werk noch nicht so ganz verwirklichen, weil ich im Responsive-Design noch kaum Ahnung habe, andererseits könnte ich eine Responsive-Website erstellen, allerdings ohne meinen Menü-Banner. Möglicherweise ist der Menü-hover-Banner noch nicht so ganz ideal für die Art von Seite, die ich erstellen muss, doch ich liebe diesen Effekt! 
Naja, egal… ich werde die Seite so lassen wie sie ist – vielleicht noch ein bisschen rumprobieren – aber im Groben und Ganzen lasse ich sie so und frage dann den Trainer, wie ich vorgehen muss um alles in responsive darstellen zu können. …da bin ich mal gespannt 🙂
Ich denke, dass sich meine Idee mit Javascript besser umsetzen ließe, da ich aber mit jener Scriptsprache noch kaum Ahnung habe, werkle ich noch im HTML sowie CSS rum.

Menü mit Hover-Bilderwechsel

Gestern wollte ich mal schauen, ob es möglich ist eine Slideshow so abzuändern, dass man die Bilder mittels eines Menüs mit Hovereffekt aktivieren kann.
Ich hatte ganz übersehen, dass die Slideshow mit Javascript funktioniert, wodurch ich es dann sein gelassen habe. Es war zwar möglich „onklick“ einfach mit „onmouseover“ zu tauschen, aber die dots konnte ich nicht in ein Menü abwandeln.
Nichtsdestotrotz konnte ich einen Banner erstellen, der über das Menü die Bilder wechselt.
Hier mein Testbeispiel:

Schwer tue ich mich nun, die komplette Seite zu zentrieren und auch das Menü etwas mehr rechts vom Bild zu haben….aber ich werde mich weiter üben^^ Eigentlich wollte ich es rechts unter dem Bild haben, aber irgendwie will es noch nicht so wie ich mir das vorstelle^^ Doch ich bin froh, dass ich zumindest nahe an meiner Vorstellung dran bin 😀
Natürlich muss auch noch der leere Banner etwas an Farbe gewinnen. Er wird sich noch ändern, es war lediglich mal ein Test.

Dienstag

bin wieder zuhause 🙂
ich kann nun tabellen erstellen^^
da muss ich gestehen, dass ich anfängliche schwierigkeiten hatte. vor allem deswegen, weil ich erst checken musste, welcher befehl was auslöst…hat ne weile gedauert, aber ich werde demnächst ein paar tabellen basteln. ich muss immer alles ausprobieren und anschauen, um genau zu verstehen was ich ins html tippe.
– auf jeden fall freue ich mich sehr auf die nächste aufgabe, dabei geht es um die gestaltung bzw. die erarbeitung der eigenen homepage und ich denke, dass ich sehr gerne daran arbeiten- und mit sicherheit ein schlaffreies we haben werde xD
schlaffrei deswegen, weil ich bestimmt wieder irgend welche unrealisierbaren effekte einbauen möchte.
eine idee hab ich schon, doch die ist mit verdammt viel arbeit verknüpft, da ich für dieses projekt noch zu wenig kann. doch ich werde mich draufstürzen und einfach mal mit den möglichkeiten, die ich im moment habe, versuchen der idee näher zu kommen.
ich freue mich riesig darauf, denn ich kann wieder kreativ sein, herumtüfteln, meinen pc anschreien und zuschauen, wie meine idee an farbe gewinnt. und das tolle daran ist, ich erhalte ein feedback, das feedback eines profis und jenes der restlichen teilnehmer des kurses! 🙂
schmett 3

 

html –

Bin gerade dabei an einer Seite zu arbeiten.
Momentan arbeite ich ohne CSS, weil wir es noch nicht durchgenommen haben. Es soll eine einfache Seite mit mehreren, im Menü verlinkten Unterseiten sein. Bis auf das Menü im Footer funktioniert auch alles, leider konnte ich den Fehler noch nicht ausfindig machen. Die Links werden im Footer zwar angezeigt, doch sie lassen sich nicht anklicken 😀
Ich vermute, dass sich irgend etwas beißt, doch fragt mich nicht was^^ Wahrscheinlich sind es die beiden Link-Menüs, doch ich wollte Impressum oder bspw. Datenschutz nicht im top-Menü haben. Ich werde es mir morgen genauer anschauen, ansonsten frage ich den Lehrer, was ich falsch gemacht habe. Vielleicht ist es auch das fixierte Logo??? KA 😀
Mal hoffen, dass ich es noch rauskriege^^

 

html -8-)

Demnächst werde ich eine kleine Website mit einfachen Html-Elementen entwerfen =)
Ich freue mich schon darauf und bin gespannt wie ich das Erlernte anwenden werde. Damit ich alles im Kopf behalte, werde ich versuchen den Html-Code mit Inhalt- zunächst – vom Kopf heraus zu schreiben, denn so lerne ich am besten, in der Hoffnung, dass mir zukünftig alles automatisch von der Hand geht 🙂
Doch bei diesem Lehrer habe ich keine Zweifel, das wird schon hinhauen! Echt klasse!

 

Html – =)

Auch heute gabs wieder einen tollen Unterricht, diesmal durften wir uns mit Block- und Inlineelementen beschäftigen und zudem das Einfügen von Textfeldern sowie Check- und Radioboxen testen. Wir haben viel Rumprobiert und es hat mir extremen Spaß gemacht, auch wenn ich heute sehr müde war! Diesem Lehrer höre ich echt gerne zu, er bringt den nötigen Witz mit in den Unterricht und erklärt echt gut 🙂

html – 2. Unterrichtstag :)

AHHHHHHHHHHHHHHH, MEGA 🙂

Ein echt mega geiler Lehrgang, genau das was ich mir erhofft hatte!
Heute hatten wir mit html angefangen, wobei uns jeder einzelne tag bzw. jeder einzelne Befehl genau erklärt wurde. Natürlich durften wir die ganze Zeit üben und die neu erlernten Befehle ausprobieren.

html_index

Es machte mir wahnsinnig viel Spaß, auch wenn ich jene Übungen schon kannte,  war es eine tolle Wiederholung, weil ich bereits Vieles vergessen hatte, nebenbei weiß ich nun, dass <br> „break“ bedeutet und, dass ich nicht kilometerlange breaks im html setzen muss, sondern deren Höhe im CSS festlegen kann.^^
Ich bin richtig glücklich, diesen Lehrgang besuchen zu dürfen…es ist echt hammer!

party_smiley

Wir arbeiteten nicht mit Notepad++, sondern mit dem Text- und Code-Editor „Adobe Brackets“, den ich mir neben Notepad++ installieren werde, damit ich Zuhause, dasselbe Programm wie im Unterricht benutzen kann. Ich muss jedoch sagen, dass ich auch mit dem Notepad++ immer gut klar kam.
Unser Lehrer ist echt klasse!

 

Inns_Web Dunkeldesign

Für Diejenigen (wie bspw. mich)schüchtern_smiley, die lieber dunkle Websites mögen, habe ich nun auch ein Dunkel Design erstellt. Denn ich fände es recht angenehm, wenn es auf jeder Seite so einen Button geben würde, der den Wechsel auf ein dunkles Design ermöglicht.

Inns_Web Dunkel Design

Nichtsdestotrotz möchte ich betonen, dass dies nur eine Testseite ist, die mir als Übung dient. Wie sie dann aussehen wird, entscheidet sich, sobald ich diesen Fachlehrgang besucht habe und Webdesigner bin.

Hier ein paar Bilder zum Dunkel Design:

Die Responsive-Navigation funktioniert!

Heute war ich den ganzen Tag am Rumwerkeln, doch nun funktioniert auch alles schüchtern_smiley!
Bin mega glücklich darüber, dass alles so gut hingehauen hat. Ich denke, dass die Seite jetzt um Einiges besser aussieht.

Hier der Link zur Hauptseite:

Inns_Web

 

Javascript: Responsive Navigation Bar

Gestern war ich länger am Lesen und Üben, doch irgendwie sah ich die Zeit nicht, endlich mal eine Navigationsleiste zu erstellen, die sich auf alle Seitenverhältnisse anpassen kann. Ich hatte ja schon mal eine Responsive-Navigation von w3schools
eingebaut, doch irgendwie war da der Wurm drin, das Menü funktionierte nur dann, wenn man das Fenster zusammenzog, ansonsten blieb die Seite leer. Damals war ich echt am Verzweifeln, weil ich nicht verstand, welcher Befehl auf meiner Seite mit dem Responsive-Menü in Konflikt kam. Man muss extremst aufpassen, dass sich gewisse Befehle nicht beißen^^ teufel_smiley
Naja, gestern hab ich bei Null wieder angefangen und die Navbar funktioniert, is ja auch kein Wunder, ich musste lediglich copy+past anwenden 😀 …was mich extremst ärgert, da ich mein altes, simples Button-Menü immer noch lieber mag, als diese Responsive Navigationsleiste. Es war mein eigens erstelltes Menü! Doch was will man machen, diese verdammten Smartphones machen das komplette Design kaputt, es ist unmöglich ein schönes und gleichzeitig einfaches Design zu erstellen, ohne auf Javascript zurückgreifen zu müssen. Mir persönlich wäre es lieber mit einfachen Mitteln zu arbeiten, denn je weniger zusätzliche Funktionen eingebaut werden umso besser ist es und umso schneller lädt auch die Seite. Na, ich werde im Herbst nicht ohne Grund diesen Fachlehrgang besuchen, weil ich genau das lernen möchte…wie man trotz Responsive-Kacke eine schöne, einfache Seite erstellen kann -.-

Hier mal der Link zur gestern eingefügten Responsive Navigation:
Responsive Inns_Web

Ich hab das Menü etwas umgebaut und versucht es meinem einfachen Button-Menü anzupassen. Links sind noch keine gesetzt worden, weil ja ohnehin alles noch ein Test ist.
Es ist natürlich nur eine Testseite, deswegen sieht sie auch dementsprechend aus… auch die Farben, sowie der Banner oder das Logo dienen nur zu Testzwecken. Es geht im Moment mal nur darum, die Seite mit Responsive Menü funktionsfähig zu machen. Nebenbei muss ich noch checken, wie ich die Abstände der aufgeklappten Menüleisten – im minimierten Fenster – minimieren kann. Hier fehlt nämlich ein zusätzlicher CSS-Befehl, den ich noch herausfinden muss, denn ansonsten verstellt sich die Navbar in der Normalansicht -.-
Ich muss ja auch noch ein weiteres Menü einfügen und ich bin mir sicher, dass es da dann wieder Probs geben wird…AHHHHHHHHHHHHH!übel_smiley

 

… das zusätzliche menü funktioniert!!! ätsch_smiley Allerdings hab ich nun das Problem, dass ich es über Lima-City nicht hochladen kann, irgendwie gibt es da ein Problem mit der Javascript-Datei grins_smiley staun_smileymies_smiley
Problem gelöst, ich hab einfach über Lima-City die Js-Datei direkt ins HTML eingefügt…finde ich zwar blöde, aber nun läuft es grins_smiley. Zumindest in der Normalansicht teufel_smiley, denn wenn man das Fenster verkleinert, öffnet sich dann nur das Menü in der Mitte…es ist zum Kotzen! kotz_smiley grün_smiley

Die Menü´s beißen sich und ich hab noch nicht die nötige Erfahrung um zu wissen, wie man so ein Problem löst. …DOCH ICH FINDE ES NOCH HERAUS -.- mies_smiley