PHP电子邮件表单中的锚标记

Question

Can you please help anybody?

I have made a mail form with PHP. This form is all the way at the bottom of the page. When I click send (this is an input tag), if there are errors, it will display them above the form.

But when you click on send the page will first go back to the top and you have to scroll all the way down to see if you have made any errors.

So is it possible to keep the page from jumping back the the start?

I know it was been solved many times e.g. here Is it possible not to jump to the top of the page on form submit? but enclose this code it will still scrool above contact section in the portfolio section...... my page svejdamartin.com Do you have any ideas ?

<footer>
  <section id="contact">                   
    <div class="row">
      <div class="col-md-6 col-md-offset-3">
        <div id="fourth">
          <h1>Contact Form</h1>
          <p>Please, do not hesitate to contact me if you want to get more information.</p>
           <?php
             if (isset($_GET['sent']) === true) { // ne POST ale GET //
               echo '<div class="alert alert-success" role="alert">Thank you, I will be in touch</div>'; // toto se vypise po odeslani vzkazu //

             } else {  //tento tag konci az na konci formulare !!! Otevrel jsem tam php a ukoncil tento else //
               if (empty ($errors) === false) { // tohle php vypisuje upozornovaci hlasky primo nad formularem //
                 echo '<ul>';
                 foreach($errors as $error) {
                   echo '<li>', $error, '</li>';            
                 }
                 echo '</ul>';
               }           
             ?>
             <form id="form-anchor" method="post" action="index.php#form-anchor">
               <div class="form-group">
                 <input type="text" name="name" class="form-control" placeholder="Your name" <?php if (isset($_POST['name']) === true) { echo 'value="', strip_tags($_POST['name']), '"'; } ?>>                                       
               </div>
               <div class="form-group">
                 <input type="email" name="email" class="form-control" placeholder="Your email" <?php if (isset($_POST['email']) === true) { echo 'value="', strip_tags($_POST['email']), '"'; } ?>>                                       
               </div>                                                                        
               <div class="form-group">
                 <textarea name="message" rows="5" class="form-control" placeholder="message...."><?php if (isset($_POST['message']) === true) { echo strip_tags($_POST['message']); } ?></textarea>                                       
               </div>
               <div class="checkbox">
                 <label>
                   <input type="checkbox" name="check">I am human
                 </label>
               </div>
               <input type="submit" name="submit" class="btn btn-secondary" value="send message">                                   
             </form>
             <?php
             }
           ?>
         </div>    
       </div>
     </div>
  </section>
</footer>

Answer 1

The reason why the page ends in the portfolio section instead of contacts is because the browser looks for the #fourth anchor before the images in the portfolio are loaded.

So the browser correctly positions the page but then the contact form moves down because of the animation.

One way to fix this is to define the height of the #imag div so that it is already the size that the images will be.