scroll animation mit javascript?
 window.onscroll = function() {scrollFunction()};
                
                function scrollFunction() {
                  if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
                    document.getElementById("pic").style.marginTop = "0px";
                    document.getElementById("pic").style.marginLeft = "900px";
                    document.getElementById("pic").style.width = "100px";
                    document.getElementById("pic").style.height = "100px";
                    document.getElementById("h1").style.width = "1003px";
                    document.getElementById("h1").style.height = "60px";
                    document.getElementById("h1").style.marginTop = "0px";
                    document.getElementById("h1").style.textAlign = "center";
                  } else {
                    document.getElementById("pic").style.marginTop = "110px";
                    document.getElementById("pic").style.marginLeft = "800px";
                    document.getElementById("pic").style.width = "200px";
                    document.getElementById("pic").style.height = "200px";
                    document.getElementById("h1").style.width = "250px";
                    document.getElementById("h1").style.height = "50px";
                    document.getElementById("h1").style.marginTop = "195px";
                  }

 Hi, kann mir vielleicht jemand helfen die scroll animation so zu gestalten, dass sie nicht so abrupt geschieht ?

..oder gibt es eine bessere Lösung für mein Vorhaben, bzw wie könnte man es einfacher coden ?

Sry, bin totaler Anfänger =)

Computer, HTML, programmieren, CSS, JavaScript, Webdesign
Webdesigner oder Webentwickler werden?

Hallo, momentan bin ich noch Schülerin und so langsam muss ich mich entscheiden welchen Weg ich für meinen beruflichen Werdegang einschlagen will. Mich haben Computer schon immer fasziniert, hauptsächlich in Sachen Software und konnte mich immer freuen, wenn ich Menschen bei allgemeinen PC-Problemen helfen konnte. Aus diesem Grund habe ich mir lange vorgenommen in Richtung IT zu gehen. Am liebsten wäre es mir, wenn ich mich in dem Beruf ein wenig kreativ austoben könnte, da da nunmal, neben Ordnung/Struktur, meine größte Kompetenz liegt. Ich habe da z.B. an Webentwickler und/oder -designer gedacht, allerdings habe ich große Angst, dass mein logisches Denken, was ja ziemlich wichtig in Sachen Programmieren ist, nicht ausreichen wird (war in Mathe immer nur ein dreier-vierer Typ).

Zu Beginn der 10 Klasse im Gymn. hatte ich Informatik als normalen Grundkurs, wo wir viel mit Java gearbeitet haben. Hatte aber echt Probleme damit klarzukommen, weil es viel logischer zuging, wobei das früher mit HTML (vorher auf Realschule) leichter war.

Ich würde aber ganz gerne beides sein, Webentwickler UND Designer. Würdet ihr mir das raten, was ich mir wünsche, oder sollte ich mich aufgrund meiner Kompetenzen, doch nur auf Webdesigner begrenzen? (Wobei mir da die Sorge aufkommt, dass es ein etwas zu 'unsicherer' Job ist, was ja leider oft so mit kreativen Berufen ist)

Beruf, Schule, Informatik, Webdesign, Webentwicklung, Ausbildung und Studium, Beruf und Büro
Navigation ausklappbar <html/CSS>?

Hallo,

ich möchte eine Navigation bauen, die wenn man hovert noch Unterpunkte anzeigt. Ich habe es so gemacht und komme leider nicht mehr weiter, wenn sich die Navigation ausklappt soll es ganz oben angezeigt werden. Ich habe einen Button unter der Navigation und als ich es selbst versucht hatte, zeigte es mir das Ausgeklappte hinter dem Button.

HTML:

    <header>
        <nav>
            <ul>
                <li><a href="">Hallo</a>
                    <ul>
                        <li><a href="">Hallo</a></li>
                    </ul>
                </li>
                <li><a href="">Hallo</a>
                    <ul>
                        <li><a href="">Hallo</a></li>
                        <li><a href="">Hallo</a></li>
                    </ul>
                </li>
                <li><a href="">Hallo</a></li>
                <li><a href="">Hallo</a></li>
                <li><a href="">Hallo</a></li>
                <li><a href="">Hallo</a></li>
            </ul>
        </nav>


    </header>

CSS:

header ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: darkblue;
  height: 1.5cm;
  
}


header li {
  float: left;
}


header li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}


header li a:hover:not(.active) {
  background-color: rgb(195, 251, 255);
  color: black;
  height: 29px;
  font-weight: bolder;
}


header .active {
  background-color: #00e1ff;
  height: 21px;
  height: 29px;
  font-weight: bolder;
  color: darkblue;
}

Ich hoffe, dass mir irgendjemand helfen

Danke im voraus

Ps.: Das "Hallo" ist ein Platzhalter.

HTML, Programmierer, programmieren, CSS, Programmiersprache, Webdesign, Visual Studio Code
Einzelne Schriften in HTML Bearbeiten?

Hallo,

ich habe vor kurzem begonnen eine Website mit HTML zu programmieren, dazu nutze ich Visual Studio Code, aber ich mache das ganz noch nicht so lange, also kenne ich mich noch nicht so gut aus. Zurzeit versuche ich eine Tabelle mit verschiedenen Raritäten zu erstellen. Dazu soll z.B. "Rare" einen blauen Rahmen bekommen, so ähnlich wie in Bild 1 zusehen.

Ich habe schon versucht es zu schaffen, dennoch habe ich bisher nur hinbekommen um alles einen Rahmen zu kreieren.

Meine Frage ist nun, wie man das individuell anpassen kann. So brauche ich die Rahmen nur bei den Namen der Raritäten und diese sollen jeweils eine eigene Farbe haben (z.B. "Rare" = blau, "Epic" = Violett usw.). Außerdem soll der Rahmen genau passen. So ist es bei mir oben so, dass es für "Uncommon" passt, aber für "Epic" viel zu groß ist. Meine Skills in HTML reichen bisher nur die Rahmen für alle zu machen. Ich habe den Style so gemacht:

CSS:

table tr td
{
  font-size: 1.2em;
  background: #fff;
  color: black;
  border-radius: 20px;
  padding: 4px 10px;
}

Vermutlich nicht besonders gut, aber da hoffe ich auf eure Hilfe 😅 Falls es euch etwas hilft, schreib' ich hier noch ein Beispiel hin, wie ich die Tabelle gemacht habe (das Richtige ist natürlich länger)

HTML:

<table>
  <thead>
    <tr>
      <th>Eyes</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Normal</td>
      <td>23.99%</td>
      <td>Common</td>
    </tr>
  </tbody>
  <tfoot>
  </tfoot>
</table>
Bild zum Beitrag
Computer, HTML, programmieren, CSS, Webdesign, Visual Studio Code
Positionierung von Pfeilen in Flexboxen?

Hallo,

ich wollte bei meiner Website eine kleine Slideshow einbauen. Dazu habe ich erst einmal Pfeile erstellt. Diese wollte ich nun richtig positionieren. Ich hatte die Idee, eine Flexbox um die Bilder mit den Pfeilen zu erstellen und die Pfeile dann einfach mit align-items zu positionieren. Irgendetwas habe ich allerdings falsch gemacht. Vielleicht fällt euch ja mein Fehler auf. Bin für jeden Tipp dankbar.

html:

<div class="slide">
            <div id="footer2">
                <div id="bilder">
                    <div id="flexbox">
                        <div class="post">
                            <img src="wohnzimmer.png" alt="Wohnzimmer">
                            <div class="post-s">
                                <h2>Einbaumöbel</h2>
                            </div>
                        </div>
                        <div class="post1">
                            <img src="badezimmer.png" alt="Badezimmer">
                            <div class="post1-s">
                                <h2>Badmöbel</h2>
                            </div>
                        </div>
                        <div class="post2">    
                            <img src="einbauschränke.png" alt="Einbauschränke">
                            <div class="post2-s">
                                <h2>Einbauschränke</h2>
                            </div>
                        </div>
                    </div>
                    <div class="post3">
                        <img src="hochbett.png" alt="Hochbett">
                        <div class="post3-s">
                            <h2>Kinderhochbetten in Eichemassivholz</h2>
                        </div>
                    </div>
    
                    </div> 
                    
                </div>
                <a class="pfeil pfeil-links"><span>&#10094;</span></a>
                <a class="pfeil pfeil-rechts"><span>&#10095;</span></a>
            </div> 
        </div>

Css:

.slide{
    display: flex;
    border: solid black;
}
.pfeil {
    position: absolute;
    top: 0px;
    bottom: 0px;
    font-size: 50px;
    font-weight: bold;
    display: flex;
    align-items: center;
    
}
.pfeil-links {
    left: 0;
}
.pfeil-rechts {
    right: 0;
}

Bild zum Beitrag
Computer, HTML, programmieren, CSS, Programmiersprache, Webdesign
Weiterbildung Webdesign, Mediengestalter Umschulung oder Web Development Studium?

Hallo :)

Ich bin in der luxuriösen Situation, dass ich wahrscheinlich das Recht auf eine Umschulung habe.

Ich habe ein künstlerisches Studium vor über elf Jahren abgeschlossen und bin schon Technik/Grafik-affin, daher überlege ich mich ganz praxisnah technisch-kreativ ausbilden zu lassen. Möchte später gerne angestellt oder als Freelancer Design/Entwicklungsjobs - ggf. kleine Komplettpakete anbieten können, daher soll der Programmierteil in der Ausbildung genauso Stellenwert haben wie der Umgang mit der Adobe Palette.

Mir wurde gesagt, dass Menschen mit Programmierkenntnissen bessere Jobaussichten haben als "nur" geprüfte MediengestalterInnen, weswegen mir alternativ eine Weiterbildung zur Webdesignerin vorschwebt, da hier imho noch mehr Wert auf Programmierung, UX Design etc. gelegt wird als beim Mediengestalter digital und print - wenn das stimmt.

Da Webdesign kein geregelter Ausbildungsberuf ist habe ich aber Bedenken, dass der Abschluss auf dem Markt "nichts wert" ist und die Joblage ohne vorherige grundständige IT oder Mediengestalter Ausbildung super schlecht für mich aussieht. Den Web Developer Studiengang habe ich zufällig im Netz gefunden.

Beides - IHK Umschulung + Webdesign Weiterbildung - würde mir aber nicht bezahlt werden und nun muss ich mich entscheiden: Was ist sinnvoller? (siehe Umfrage)

Habt ihr Tipps, Erfahrungen?

Weiterbildung Webdesign mit Trägerzertifikat (1170 Lerneinheiten) 100%
Umschulung MediengestalterIn Digital u. Print - Spez.Digital/ IHK 0%
BA/BSc (Hons) Web Development (24-40 Monate) 0%
Anderes (bitte Vorschläge) 0%
Umschulung, Webdesign, Ausbildung und Studium, Beruf und Büro
Wie bespreche ich mit einem Kunden, wie seine Webseite mit Wordpress aussehen soll?

Hi Leute,

ich habe zum ersten mal die Möglichkeit für einen Freund eine Webseite für sein Restaurant zu erstellen.

Ich benutze dafür Wordpress und habe auf seine Kosten den Divi Theme und auch ein Webhosting gekauft. Es ist auch soweit alles miteinander verknüpft.

Allerdings hat mein Kollege jetzt natürlich große Erwartungen von mir, da ich in einer kleinen Digitalagentur arbeite. Ich bin da als Grafik Designer tätig und habe in der Praxis nicht so viel Erfahrung mit Aufbau von Webseiten, bzw. mit Wordpress, Themes usw. Aber ich habe richtig Lust darauf, mir was neues anzueignen und es eventuell auch nebenbei zumachen.

Nur zu Info, ich kann meine Kollegen auf der Arbeit leider nicht nach Rat oder Unterstützung bitten, da ich es gerne für mich behalten möchte.

Jetzt geht es mir natürlich darum, dass ich bei Null anfangen muss und nicht genau weiß wie ich vorgehen soll. Jetzt muss ich erstmal herausfinden, wie mein Freund sich seine Webseite gerne vorstellt.

Ich denke, wenn ich eine Webseite bei Null aufbauen würde, könnte es zu Problemen führen, sobald ich etwas falsch mache und es wird mir sicher auch viel Zeit rauben. Also denke ich, dass ich ihm diverse Vorlagen vom Divi-Theme zeige und er dann entscheidet, welches ihm am besten gefällt. Ist das unprofessionell?

Ich hoffe ihr könnt mir folgen und versteht worauf ich hinaus will.

Über jede Hilfe würde ich mich freuen!

Webseite, WordPress, CMS, Webdesign, Webentwicklung, divi

Meistgelesene Fragen zum Thema Webdesign