Equestrian Center

Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae

Full Service Equestrian Center

Horse Riding
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sed finibus nisi, sed dictum eros.
Horse Stalls
Quisque aliquet velit sit amet sem interdum faucibus. In feugiat aliquet mollis etiam tincidunt ligula.
Horse Training
Luctus lectus non quisque turpis bibendum posuere. Morbi tortor nibh, fringilla sed pretium sit amet.

Pure Elegance & Perfect Training

Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec velit neque, auctor sit amet aliquam vel, ullamcorper sit amet ligula. Pellentesque in ipsum id orci porta dapibus. Curabitur aliquet quam id dui posuere blandit.

Making Riding Accessible To All

Private Lesson

Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Vestibulum ante ipsum primis in faucibus orci luctus et

Beginner To Advance
Nisl massa, ultrices vitae ornare sit amet, ultricies eget orci. Sed vitae nulla et justo pellentesque congue nec eu risus.
Coach Training
Ac feugiat ante. Donec ultricies lobortis eros, nec auctor nisl semper ultricies. Aliquam sodales nulla dolor.

Join Our Club

"Nisl massa, ultrices vitae ornare sit amet, ultricies eget orci. Sed vitae nulla et justo pellentesque congue nec eu risus. In non pulvinar purus. Curabitur nisi odio, blandit et elit at, suscipit pharetra efficitur elit."

Axel Farrow

"Vitae consequat augue. Vivamus eget dolor vel quam condimentum sodales in bibendum odio urna sit amet."

Angela Charlton

"Luctus lectus non quisque turpis bibendum posuere. Morbi tortor nibh, fringilla sed pretium sit amet. Aliquam sodales nulla dolor sed vulputate sapien."

Juanita Moran

Erstelle Dein Menü wie gewohnt

Im Divi Builder erstellst Du Dein Menü wie gewohnt. Die Sekktion muss mit stickyversehen sein.

Die Sektion muss eine ID bekommen. In unserem Muste hat die Sektion die ID:global-header-section.

Anschließend fügst Du folgendes Script entweder in ein Codemodul auf der Seite des DIVI-Builders ein, oder in die JS-Datei des Child Themes. Genauso verfährst Du mit dem CSS-Code. Den natürlich nicht in die JS-Datei, sondern in die Style Datei des Child-Themes.

Achtung gut aufpassen!

wenn man das Code-Modul verwendet muss man das script-tag bzw. das style-tag verwenden.

Beim Eintragen in die Dateien darf man keine Tags verwenden. Sonst funktioniert das nicht.

Das ist das Script

<script>jQuery(function($){
   
var topPosition = 0;
 
 
$(window).scroll(function() {
 
    var scrollMovement = $(window).scrollTop();
   
    if (topPosition < 300 ){
    }
    else{
    if(scrollMovement > topPosition) {
          $('#global-header-section').removeClass('show-header');
          $('#global-header-section').addClass('hide-header');
    } else {
          $('#global-header-section').removeClass('hide-header');
          $('#global-header-section').addClass('show-header');
    }
    }
    topPosition = scrollMovement;
});  
   
});</script>

Das ist der CSS-Code

<style>
 
.hide-header {
opacity: 0;
margin-top: -300px !important;
}
 
.show-header {
opacity: 1;
margin-top: 0px !important;
}
 
#global-header-section {
-webkit-transition: all 1.0s ease !important;
-moz-transition: all 1.0s ease !important;
-o-transition: all 1.0s ease !important;
-ms-transition: all 1.0s ease !important;
transition: all 1.0s ease !important;
}</style>
DSGVO Cookie Consent mit Real Cookie Banner