Beiträge von Sundream

Sundream

Hat sich erledigt, hab die Lösung mit Hilfe einer KI gefunden

Hier der Code wie er dann sein müsste:

Code

const observer = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    const squares = entry.target.querySelectorAll('.square');
    squares.forEach(square => {
      if (entry.isIntersecting) {
        square.classList.add('fadeInDown');
      } else {
        // We're not intersecting, so remove the class!
        square.classList.remove('fadeInDown');
      }
    });
  });
});
observer.observe(document.querySelector('.column'));

Alles anzeigen

Sundream

Hallo,

ich habe einen Code, den ich auf eine Galerie anwenden will. EIne bestimmte Animation soll immer geladen werden, wenn auf ein Bild gescrollt wird.

Das habe ich alles soweit hinbekommen. Jetzt ist es aber eine Galerie, die nicht nur aus einem Bild, sondern aus mehreren Bildern nebeneinander besteht. Ich möchte gerne, dass diese alle animiert werden. Derzeit funktioniert es aber nur für ein einziges Bild, wenn ich allen Bildern die gleiche Klasse gebe... auch, wenn ich die Klasse ändere und den Code dupliziere, funktioniert es nur für ein Bild. Was muss ich tun um das zu ändern?

Hier der JS Code:

Code

    const observer = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    const square = entry.target.querySelector('.square');

    if (entry.isIntersecting) {
      square.classList.add('fadeInDown');
    return; // if we added the class, exit the function
    }

    // We're not intersecting, so remove the class!
    square.classList.remove('fadeInDown');
  });
});

observer.observe(document.querySelector('.column'));

Alles anzeigen

Ich denke der Fehler ist, dass die Klasse nur einmal abgefragt wird und nicht alle gesucht werden. Aber ich weiß nicht, was ich ändern muss...

Danke!

Sundream

Keiner einer Antwort...?

Sundream

Hallo,

ich möchte in meinem Header gerne ein full-size Video. Soweit so gut.

Habe jetzt alles so gestaltet wie es aussehen soll.... ABER: Irgendwas stimmt mit meinen Positionierungen nicht... jedenfalls verschwindet der Folgecontent hinter meinem Video und wird nicht einfach daran angehängt. Ich weiß nicht wo es hackt... Kann mir jemand weiterhelfen?

HTML Code:

HTML

<!DOCTYPE html>
<html lang="de">
   <head>
      <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">
      <link rel="stylesheet" href="style.css" type="text/css" />
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
      <meta charset="UTF-8">
      <meta name="robots" content="index, follow" />
      <title>Lorem ipsump</title>
   </head>
   <body>
      <div id="video-container">
         <div id="video-content">
            <video src="img/Video.mp4" playsinline autoplay muted loop></video>
         </div>
         <header>
            <img src="img/Logo-1.svg" class="Logo">
            <img src="img/hamburger.png" class="hamburger">
            <h1>SLoremn<br> bopsumm!</h1>
            <hr size="4">
            <p style="font-size: 2.5em; line-height: 1.5em;"><br> - Lorem ipsum</p>
            <img class="Signet" src="img/100-Jahre-Signet.svg">
         </header>
      </div>
      <div class="Einleitungstext">
         <img src="img/Berge.svg" class="Berge">
         <h2>Lorem ipsum </h2>
         <p> blub </p>
      </div>
      <p>Lorem ipsum</p>
      <br>
      <br>
      <br>
      <br>
      <p>
   </body>
   <main>
       
   </main>
</html>

Alles anzeigen

CSS

Code

@font-face { 
font-family: "Yanone Kaffeesatz"; 
src: url("fonts/Yanone.ttf");}

@font-face { 
font-family: "Lobster"; 
src: url("fonts/Lobster.otf");}

* {padding: 0;margin: 0;box-sizing: border-box;}

html {max-width:100%; scroll-behavior:smooth;overflow-x: hidden;}


* {
  box-sizing: border-box;
}
#video-container {
  margin: 0;
  background: #3E322D;
  background-size: cover;
}
#video-container #video-content video { 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

#video-container #video-content:before {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    background: rgba(62,50,45,0.66); 
    z-index:1;
}

#video-container header {
  position: absolute;
  width: 100%;
  text-align: center;
  color: white;
  transition: .4s;
  z-index: 2;
}

#video-container header img.Logo {
  display: inline-block;
  float:left;
  width: 20%;
  margin-left: 5%;
}


#video-container header img.hamburger {
  display: inline-block;
  float: right;
  width: 5%;
  margin-right: 7%;
  margin-top: 4%;
}

#video-container header img.Signet {
  width: 10%;
}
h1 {
  font-family: Lobster;
  font-size: 4em;
  margin-top: 12%;
}

p {font-family: Yanone Kaffeesatz;}

hr {width: 10%; text-align: center;margin: 0 auto; margin-top: 2%; margin-bottom: 2%; background-color: white;}

.Einleitungstext {clear: both;position: relative;}

Alles anzeigen

Vielen Dank schonmal!

Sundream

Hallo Basti,

danke für die schnelle Antwort!

Gäbe es denn eine Lösung ohne PHPmailer? Es ist insgesamt für eine Übung und ich will das einfach nur noch mit so wenig Aufwand wie möglich zu Ende bringen... Wäre also super, wenn es irgendeinen Zusatz gäbe, der UTF-8 und HTML ohne PHPmailer aktivieren würde. Ob das dann am Ende in der Praxis wirklich zu 100% funktioniert in Bezug auf Spam, etc. ist erstmal zweitrangig.

Danke!

Sundream

Hallo,

ich habe ein Stück PHP-Code, das per Mail versendet wird.

Cool wäre es, wenn die Mail dann HTML und UTF-8 erkennen würde.

Die PHP-Datei ist als UTF-8 abgespeichert und hat den Zusatz auch als meta.

Das ist der Code:

Code

 $webmaster = "Hier könnte eine Email stehen";

        
        //$header .= "Content-type: text/plain; charset=iso-8859-1";
        //$Header = "Content-type: text/html; charset=utf-8";  
        //$mailbody = "Content-type: text/html; charset=utf-8";  
        $mailbody .= "Name: $_POST[Anrede]" . "€äöü" . "$_POST[Name]\n";
        
            // E-Mails versenden:
            @mail($webmaster, "Aufgabe 3", $mailbody);

die auskommentierten Zeilen habe ich bereits getestet, aber das hat nicht funktioniert.

Kann mir da jemand weiterhelfen?

Vielen Dank!

Sun

Sundream

Wie kann ich das denn auf Halde setzen?

Sundream

Hallo Basti,

danke für deine Antwort... ich habs anderweitig hinbekommen.

MySQL ist keine Option. Die Aufgabe lautet: Mit Hilfe von Sessions

Ich will als Anfänger keinen Shop programmieren, aber werde von meiner Fortbildung gezwungen... Hab auch noch nicht herausgefunden, wie man das mit dem bisschen lehrmaterial hinbekommen soll.. .sitze schon mehr als 1 Monat dran mittlerweile...

Sundream

Hallo ihr,

ich weiß, dass es für Validierungen von Email-Adressen einige Vorlagen im Web gibt und ich weiß auch, dass man eigentlich nicht mis JS validiert, ABER:

ich versuche gerade JS zu lernen und zu verstehen, deswegen suche ich auf diesem Weg nach einer anderen Lösung.

Ich habe einen Code zum Überprüfen von Email-Adressen geschrieben, der funktioniert:

Code

function leer() {
    if (document.form.nachname.value.length < 2) {
        alert('Bitte geben Sie Ihren Namen an!');
        document.form.nachname.focus();
    } else {
        if (document.form.mail.value.indexOf('@') < 0) {
            alert('Bitte geben Sie Ihre E-Mail an!');
            document.form.mail.focus();
        } else {
            if (document.form.mail.value.indexOf('.') < 0) {
                alert('Bitte geben Sie Ihre E-Mail an!');
                document.form.mail.focus();
            } else {
                document.form.submit();

            }
        }

    }

Alles anzeigen

Jetzt überprüft der Code, ob die E-Mail Adresse ein @ und einen Punkt enthält. Aber nicht, ob auch ein Punkt NACH dem @ kommt.

Wie muss ich das noch ergänzen, dass das überprüft wird?

Danke!

Sun

Sundream

Hallo Gastl,

danke für deine Antwort. Die Emails werden von Strato gehostet und per Outlook aufgerufen...

VG

Sun

Sundream

Die Seite bei der das Kontaktformular eingebunden ist, ist http://www.rhoener-abbund.de

Ganz unten

Sundream

Hey ihr,

ich nutze, weil ich sonst nie mit den Kontaktformularen zurecht gekommen bin, das Kontaktformular der Seite https://www.kontaktformular.com/

Am Anfang hat das auch super funktioniert. Nur jetzt ist mein Problem, dass die Emails IMMER im Spam landen.

Kann mir da vielleicht jemand sagen, was ich machen muss, damit das nicht mehr passiert?

Danke!

Viele Grüße

Sun

Sundream

Hallo ihr,

ich habe ein Problem bei der Übergabe von Daten eines Kontaktformulars.

Es wird plötzlich Absender nicht mehr richtig weitergegeben (Email kommt von postmaster@was auch immer)

Allgemein wird nur die Telefonnummer weitergegeben. Nachricht, Name, etc. fehlen.

Ich hätte gerne in der Email etwas stehen wie "Der Datenschutz wurde akzeptiert.", wenn die Checkbox ausgewählt ist.

Zusätzlich wäre es super cool, wenn da dann stehen würde:

Name: Hans Fritze

Telefon: 0123456

Nachricht: bla bla

Checkbox: Die Datenschutzerklärung wurde akzeptiert.

Ich hab mir mal wieder meinen Code selbst zusammen gebastelt, weil ich kein PHP kann... und komme einfach nicht weiter.

HTML:

Code

<form action="contact.php" method="post">
  <div class="elem-group">
    <label for="name">Name/Firma</label>
    <input type="text" id="name" name="visitor_name" placeholder="John Doe" pattern=[A-Z\sa-z]{3,20} required>
  </div>
  <div class="elem-group">
    <label for="email">E-mail</label>
    <input type="email" id="email" name="visitor_email" placeholder="john.doe@email.com" required>
  </div>

  <div class="elem-group">
    <label for="title">Betreff</label>
    <input type="text" id="title" name="email_title" required placeholder="Unable to Reset my Password" pattern=[A-Za-z0-9\s]{8,60}>
  </div>
  
  <div class="elem-group">
    <label for="telefon">Telefon:</label>
    <input type="text" id="telefon" name="visitor_telefon" required placeholder="01234567" pattern=^[0-9]{1,}>
  </div>
  <div class="elem-group">
    <label for="message">Ihre Nachricht:</label>
    <textarea id="message" name="visitor_message" placeholder="Say whatever you want." required></textarea>
  </div>
  <div class="elem-group">
  <label>
    <input for="checkbox" type="checkbox" id="checkbox_datenschutz" name="checkbox_datenschutz" required/>
    Ich habe die <a href="Datenschutz.html">Datenschutzerklärung</a> zur Kenntnis genommen. Ich stimme zu, dass meine Angaben und Daten zur Beantwortung meiner Anfrage elektronisch erhoben und gespeichert werden.
Hinweis: Sie können Ihre Einwilligung jederzeit für die Zukunft per E-Mail an datenschutz@rhoener-abbund.de widerrufen.
</label>
</div>


  <button type="submit">Senden</button>
</form>

Alles anzeigen

PHP:

PHP

<?php
 
if($_POST) {
    $visitor_name = "";
    $visitor_email = "";
    $email_title = "";
    $visitor_telefon = "";
    $visitor_message = "";
       $recipient = "Stefanie.Wolf96@gmx.de";
    $checkbox_datenschutz = "Die Datenschutzerklärung wurde akzeptiert.";
 

     
    if(isset($_POST['visitor_name'])) {
        $visitor_name = filter_var($_POST['visitor_name'], FILTER_SANITIZE_STRING);
    }
     
    if(isset($_POST['visitor_email'])) {
        $visitor_email = str_replace(array("\r", "\n", "%0a", "%0d"), '', $_POST['visitor_email']);
        $visitor_email = filter_var($visitor_email, FILTER_VALIDATE_EMAIL);
    }
     
    if(isset($_POST['email_title'])) {
        $email_title = filter_var($_POST['email_title'], FILTER_SANITIZE_STRING);
    }

     if(isset($_POST['visitor_telefon'])) {
        $visitor_telefon = filter_var($_POST['visitor_telefon'], FILTER_SANITIZE_STRING);
    }
     
         
    if(isset($_POST['visitor_message'])) {
        $visitor_message = htmlspecialchars($_POST['visitor_message']);
    }

     if(isset($_POST['checkbox_datenschutz'])) {
        $visitor_message = filter_var($_POST['checkbox_datenschutz']);
    }


  
     
    $headers  = 'MIME-Version: 1.0' . "\r\n"
    .'Content-type: text/html; charset=utf-8' . "\r\n"
    .'From: ' . $visitor_email . "\r\n";
     
    if(mail($recipient, $email_title, $visitor_telefon, $visitor_message, $headers)) {
        echo "<p>Vielen Dank für Ihre Nachricht. Wir kümmern uns umgehend um Ihr Anliegen</p>";
    } else {
        echo '<p>Es ist ein Fehler bei Versenden der Mail aufgetreten</p>';
    }
     
} else {
    echo '<p>Leider ist etwas schiefgelaufen.</p>';
}
 
?>

Alles anzeigen

Ich hoffe ihr könnt mir weiterhelfen, vielen Dank schonmal!!

Liebe Grüße

Sun

Sundream

Ah Basti das Beispiel ist super danke !! Ich brauchs nur andersrum Also wenn ein bestimmtes Element nicht mehr sichtbar ist, dann muss die nav sichtbar sein und eben dann immer am oberen bildschirmrand fixed...

Was müsste man da ändern?

Sticky heißt für mich eigentlich, dass sobald ich an der navigation vorbei scrolle die Navigation am oberen bildschirmrand sich festsetzt und ab dann immer im vieport sichtbar ist.

Sundream

Ich verstehe das Beispiel leider nicht so ganz... ich kann Javascript hald leider überhaupt nicht...

was müsste ich denn ändern?

Danke auf jeden Fall schonmal für deine Antwort.

Sundream

Hallo ihr ,

ich wechsle gerade Bilder per :hover und background-image. Code:

Code

div.img-oben-neu {background: url(Bilder/Nutzung.jpg);background-size: cover;background-repeat: no-repeat;}
div.img-oben-neu:hover {background: url(Bilder/Nutzung2.jpg);background-size: cover;background-repeat: no-repeat; }

Das funktioniert soweit gut und ist auch responsive.

Jetzt hätte ich aber eigentlich gerne noch ne transition mit .4s

background-images kann man aber keine transition zuweisen... Gibts da vielleicht irgendeine andere Lösung. Hab mich jetzt durchs Internet gewühlt und nichts brauchbares gefunden..

Ich hab gelesen, dass man das eine Bild relative positionieren kann und eins drüber legt mit position:absolute und dann mit der opacity spielt, der man ja auch ne transition zuweisen kann.

Aber dann ist es ziemlich kompliziert das ganze responsiv zu bekommen (finde ich).

Danke schonmal.

Sun

Sundream

Hallo ihr,

ich habe folgenden Code:

HTML:

HTML

<!DOCTYPE html>
<html>
  <body>
    
    <div style="background-color:red; height:500px;"></div>
        <nav class="clearfix" id="navbar">
        <ul class="clearfix">
            <li><a href="#Vorteile"class="active">Vorteile</a></li>
            <li><a href="#Leistungen">Leistungen</a></li>
            <li><a href="#Unternehmen">Unternehmen</a></li>
            <li><a href="#Kontakt">Kontakt</a></li>
        </ul>
        <a href="#" id="pull">Menü</a>
    </nav>
    
    <p>
      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.   

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.   

Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.   

Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.   

Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.   

At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, At accusam aliquyam diam diam dolore dolores duo eirmod eos erat, et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren, kasd magna no rebum. sanctus sea sed takimata ut vero voluptua. est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat.   

Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus.   

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.   
  
</p>
    
 <script>
window.onscroll = function() {myFunction()};

var navbar = document.getElementById("navbar");
var sticky = navbar.offsetTop;

function myFunction() {
  if (window.pageYOffset >= 100) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}
</script>
    
  </body>
</html>

Alles anzeigen

und dazu folgendes css:

Code

/* Navigation */
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}

ul {
    margin:0px;
    padding: 0px;
}

li {padding: 0em;
    }

nav {display: inline-block;
    width: 100%;
    background-color: white;
        position:sticky;
        top:0;
        z-index:2000;
        border-bottom: 2pt dashed #453e1b;
        
}

nav ul {
    padding: 0;
    margin: 0 auto;
    margin-left: 5%;
    
    }
nav li {
    display: inline;


}
nav a {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    font-size: 14pt;    
}

nav a:hover {text-decoration: underline;}
nav li a {    
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    border-left: 2pt dashed #453e1b;
    font-family: 'Staatliches', cursive; color: #453e1b;
    padding-left: 2%;
    padding-right: 2%;
    padding-top: 0.5%;
    padding-bottom: 0.5%;}


nav a#pull {
    display: none;
}

.sticky {
  position: fixed;
  top: 0;
  width: 100%;}

Alles anzeigen

Wenn ich jetzt möchte, dass die Navigation erst sticky wird, wenn ein bestimmtes Element (in diesem Fall das div) aus dem Bild scrollt, was muss ich dann ändern?

Ich weiß ich könnte jetzt im script sagen okay, das div ist 500px hoch, mach das bitte ab 500px. Aber was, wenn ich sage width:100%; height:auto;? dann ist die Höhe ja immer wieder unterschiedlich... Brauch da quasi ein responsive workaround

Danke schonmal!

Liebe Grüße

Sun

Sundream

Ich hab gerade mal geschaut, bei mir scrollt es nur in Mozilla Firefox und da funktioniert es auch nicht..

In Microsoft Edge und auch Chrome funktioniert es, dass er bis zum Ende der Seite geht, aber da springt er dahin und scrollt nicht...

Liegt scheinbar daran, dass einige Browser das überhaupt nicht unterstützen...

Gibt es da ne andere Lösung, dass immer zu den geklickten Navigationspunkten gescrollt wird, die in allen Browsern funktioniert?

Sundream

Also wenn ich das in einer mobilen Ansicht anschaue z.B. für Iphone oder so, dann hört es bei mir im Mozilla auf zu scrollen sobald sich die Navigation schließt und scrollt eben nicht bis nach unten.... Bei der Desktopansicht funktionierts, das ja, aber da is ja auch die mobile Navigation nicht sichtbar....

Sundream

Hier hab ich den Code mal so verändert wie ich das meine: https://codepen.io/anon/pen/BXWbZO (Hoffe der hat das jetzt gespeichert)

Wenn ich die CSS- Eigenschaften für html und body entferne kommt er im mobile Bereich wenn ich auf services klicke bis ganz nach unten. Wenn ich aber das mit dem scroll-behavior drin hab, hört er sofort auf zu scrollen, wenn die nav dann zu is (er scrollt also nichtmal ne sekunde oder so) und bleibt irgendwo mittendrin stehen.

Das würde ich verhindern wollen, weiß aber nicht wie.

Beiträge von Sundream

Javascript Animation für mehr als ein Element

Javascript Animation für mehr als ein Element

Full-size Video mit folge Content - Problem

Full-size Video mit folge Content - Problem

UTF-8 und HTML in PHP Email

UTF-8 und HTML in PHP Email

PHP Warenkorb Anzahl ändern

PHP Warenkorb Anzahl ändern

Javascript Abfrage nach @

Kontaktformular SPAM mit https://www.kontaktformular.com/

Kontaktformular SPAM mit https://www.kontaktformular.com/

Kontaktformular SPAM mit https://www.kontaktformular.com/

Contact Form - Übergabe funktioniert nicht

Sticky Nav, erst nach bestimmtem Element sticky

Sticky Nav, erst nach bestimmtem Element sticky

Transition-Ersatz bei :hover auf background-images

Sticky Nav, erst nach bestimmtem Element sticky

Toggle Navigation onclick schließen

Toggle Navigation onclick schließen

Toggle Navigation onclick schließen