better project layout

2019-03-19 11:15:32 +01:00
parent dfc932b7b0
commit 70d7497eda
128 changed files with 48 additions and 42 deletions
--- a/website/project-files/js/functions.js
+++ b/website/project-files/js/functions.js
@@ -0,0 +1,173 @@
+// ========== Scroll Top ========== //
+$(window).scroll(function(){
+    if ($(this).scrollTop() > 140) {
+        $('.scrolltop').fadeIn();
+    } else {
+        $('.scrolltop').fadeOut();
+    }
+});
+
+$(document).ready(function() {
+    $('.scrolltop').on('click', function(e) {
+        $('body,html').animate({scrollTop: 0}, 800);
+    }); 
+});
+
+// ========== Smooth Scrolling ========== //
+$(document).ready(function() {
+  $('a[href^="#"]').click(function() {
+      var href = $.attr(this, 'href');
+
+      $('html, body').animate({
+          scrollTop: $(href).offset().top
+      }, 800, function () {
+          window.location.hash = href;
+      });
+
+      return false;
+  });
+});
+
+
+
+// ========== Sticky Nav ========== //
+window.onscroll = function() {myFunction()};
+
+  var navbar = document.getElementById("nav");
+  var sticky = navbar.offsetTop;
+
+  function myFunction() {
+    if (window.pageYOffset >= sticky) {
+      navbar.classList.add("sticky")
+    } else {
+      navbar.classList.remove("sticky");
+    }
+  }
+
+
+
+
+
+
+// ========== Responsive Menu ========== //
+/* Set Nav Arrows */
+$(document).ready(function() {
+  $('.sub-menu').parent().addClass('haschildren');
+});
+
+$(document).ready(function() {
+    "use strict";
+
+    var mobileWidth = 768,
+        isMobile    = null,
+        pull        = $('a#pull'),
+        menu        = $('nav'),
+        topMenuItems = $('nav > ul > li > .trigger'),
+        menuHeight  = menu.height();
+
+    $(pull).on('click', function(e) {
+        e.preventDefault();
+        menu.slideToggle();
+        $(this).toggleClass('pull_active');
+    });
+
+    var handleResize = function(){
+        var check = $(window).width() < mobileWidth;
+
+        if(check !== isMobile){
+            if (check) {
+                topMenuItems.on('click', function(event){
+                    var target = $(event.target),
+                        subMenu = target.siblings('.sub-menu');
+
+                    // Close all other Submenus
+                    $('nav .sub-menu').slideUp();
+                    $('nav .sub-menu').parent().removeClass("submenu_open");
+
+
+                    if(subMenu.length){
+                        event.preventDefault();
+
+                        if (target.parent().hasClass("submenu_open")){
+                          subMenu.slideUp();
+                          target.parent().removeClass("submenu_open");
+
+                        } else {
+                          if (subMenu.hasClass("level2")){
+                            $('.level2').each(function() {
+                                $(this).slideUp();
+                                $(this).parent().removeClass("submenu_open");
+
+                            });
+                          } else if (subMenu.hasClass("level3")){
+                            $('.level3').each(function() {
+                                $(this).slideUp();
+                                $(this).parent().removeClass("submenu_open");
+
+                            });
+                          }
+                          target.parent().addClass("submenu_open");
+                          subMenu.slideDown();
+                        }
+                        // subMenu.slideToggle();
+                        
+                    }
+                });
+            } else {
+                $('nav#mainmenu>ul>li>a').on('mouseover', function(e) {
+                      $(this).parent().addClass('submenu_open');
+                  });
+                $('nav#mainmenu>ul>li').on('mouseleave', function(e) {
+                      $(this).removeClass('submenu_open');
+                  });
+            }
+
+            isMobile = check;
+        }
+    };
+
+    $(window).resize(handleResize);
+    handleResize();
+});
+
+
+// ========== IMG 2 BG ========== //
+function img2bg() {
+
+    $('.img2bg').each(function(i, elem){
+      $(elem).css({
+        display : 'none'
+      });
+      // var new_element = document.createElement("div");
+      $(elem).parent().css({
+        backgroundSize : 'cover',
+        backgroundImage : 'url("' + $(elem).attr('src') + '")',
+        backgroundPosition : 'top center',
+      });
+      
+    });
+}
+
+$(document).ready(function(){img2bg();});
+
+
+// ========== Responsive Pictures ========== //
+function setPictureResponsive() {
+
+    var screenwidth = $(window).width();
+    var o = 'landscape';
+    if (screenwidth>768){
+        o = 'landscape';
+    }
+    else {o = 'portrait';}
+
+    $('img.picture').each(function() {
+        var $this = $(this);
+        var img_src = $this.data(o);
+        this.src = img_src;
+
+    });
+}
+
+$(document).ready(function(){setPictureResponsive();});
+$(window).resize(setPictureResponsive);