/* NavBar: Fixed & OffConvas */ var triggerMode = "click" function getHeight() { var heightHead = ($('.site-header').height()); $('.main').css('padding-top', (heightHead + 24)); $(".navBar, #searchbar, .head__search, .screen-visible").css("top", heightHead); //console.log( heightHead ); } var getOffCanvas = $(".navBar").css('overflow-y'); if (getOffCanvas != 'scroll') { //setTimeout('getHeight()', 300); } $(document).ready(function(){ isCanvasNav() var stickyNavTop = $('.navBar').offset().top; var stickyNav = function(){ var scrollTop = $(window).scrollTop(); var getOffCanvas = $(".navBar").css('overflow-y'); if (scrollTop > stickyNavTop) { $('.navBar').addClass('nav__fixed'); if (getOffCanvas != 'scroll') { $(window).trigger( "navFixed", [ true ] ); } } else { $('.navBar').removeClass('nav__fixed'); if (getOffCanvas != 'scroll') { $(window).trigger( "navFixed", [ false ] ); } } }; stickyNav(); $(window).scroll(function() { stickyNav(); }); }); $( window ).resize(function() { isCanvasNav() //modalMobil(); }); function isCanvasNav() { //console.log( 'test' ); var getOffCanvas = $(".navBar").css('overflow-y'); if (getOffCanvas != 'scroll') { var heightNav = $('.navBar').height(); $('.nav-holder__fixed').css("height", heightNav); $('.nav-holder__fixed').removeClass('nav-holder__fixed--offcanvas'); $('.main, .navBar, .screen-visible').removeAttr("style"); if ( $('#searchbar').css("display") == 'block') { $('#searchbar').css("display", 'block'); } else { $('#searchbar').css("display", 'none'); } //$('#searchbar').css("top", heightNav); } else { $('.nav-holder__fixed').removeAttr("style"); $('.nav-holder__fixed').addClass('nav-holder__fixed--offcanvas'); //var heightHead = ($('.site-header').height()); //$('.main').css('padding-top', (heightHead + 24)); //$(".navBar, #searchbar, .head__search, .screen-visible").css("top", heightHead); //setTimeout('getHeight()', 300); $('#searchbar').css("display", 'block'); }; } $(document).on("scroll", function(){ var getOffCanvas = $(".navBar").css('overflow-y'); if (getOffCanvas == 'scroll') { if($(document).scrollTop() > 50){ $('.container').addClass('container--scrolled'); } else { //if( $('.screen-visible').hasClass( 'is-visible' ) ) { $('.container').removeClass('container--scrolled'); //setTimeout('getHeight()', 300); //} } } }); /* Off-Canvas */ $(document).ready(function(){ $('.offcanvas_button').on(triggerMode, function(e){ $('.offcanvas__holder').removeClass('is-visible--right'); $('.offcanvas__holder').toggleClass('is-visible--left'); if ($('.offcanvas__holder').hasClass( 'is-visible--left' )) { $('html, body').addClass('offcanvas-html'); $('.screen-visible').addClass('is-visible'); } else { $('.screen-visible').removeClass('is-visible'); $('html, body').removeClass('offcanvas-html'); } e.preventDefault(); }); $('.search_button, .open-search').on(triggerMode, function(e){ $('.offcanvas__holder').removeClass('is-visible--left'); $('.offcanvas__holder').toggleClass('is-visible--right'); if ($('.offcanvas__holder').hasClass( 'is-visible--right' )) { $('html, body').addClass('offcanvas-html'); $('.screen-visible').addClass('is-visible'); } else { $("#fsearchphrase_1").blur(); $('html, body').removeClass('offcanvas-html'); $('.screen-visible').removeClass('is-visible'); } e.preventDefault(); }); $('#openSearchphrase').on(triggerMode, function(e){ $("#fsearchphrase_1").trigger( triggerMode ); $("#fsearchphrase_1").focus(); e.preventDefault(); }); $('#openSearchRubric').on(triggerMode, function(e){ $("#searchRubric").trigger( triggerMode ); $("#fsearchphrase_1").blur(); e.preventDefault(); }); $('#openSearchDate').on(triggerMode, function(e){ $("#searchDate").trigger( triggerMode ); $("#fsearchphrase_1").blur(); e.preventDefault(); }); $('#openSearchPlace').on(triggerMode, function(e){ $("#searchPlace").trigger( triggerMode ); $("#fsearchphrase_1").blur(); e.preventDefault(); }); $('.screen-visible').on(triggerMode, function(e){ $("#fsearchphrase_1").blur(); $('.offcanvas__holder').removeClass('is-visible--right'); $('.offcanvas__holder').removeClass('is-visible--left'); $('.screen-visible').removeClass('is-visible'); $('html, body').removeClass('offcanvas-html'); e.preventDefault(); }); }); // Modale Filter einstellungen überprüfen für smartphone. // Bessere Funktion ohne modal // Maybe Offcanvas oder Content Austausch $(document).ready(function(){ $('.modal-button').on(triggerMode, function(e){ var modalButtonPos = $( this ).offset(); var modalButtonHeight = $( this ).height(); var modalWindow = $( this ).attr( "href" ); //var heightHead = $('.site-header').height(); //$(modalWindow).css('top', heightHead); $( modalWindow ).toggleClass('modal__mobil'); $( modalWindow ).toggleClass('modal'); //$('.screen-visible').addClass('is-visible'); $( modalWindow ).css('top', (modalButtonPos.top + (modalButtonHeight*2))); $('html, body').toggleClass('offcanvas-html'); e.preventDefault(); }); }); function modalMobil() { $( '[id^="modal-"]' ).removeClass('modal'); $( '[id^="modal-"]' ).addClass('modal__mobil'); $( '[id^="modal-"]' ).removeAttr("style"); } $(document).ready(function(){ $('.el-slider-button, .el-slider__close').on(triggerMode, function(e){ var elsliderWindow = $( this ).attr( "href" ); $(elsliderWindow).toggleClass('el-slider--left'); $('html, body').toggleClass('offcanvas-html'); e.preventDefault(); }); }); // Script für DropDown Liste Mobil $(document).ready(function(){ $('.dropdown__button').on(triggerMode, function(e){ //var dropDown = $( this ).attr( "href" ); //$( dropDown ).toggle(); $( this ).next(".dropdown__list").slideToggle('fast'); e.preventDefault(); }); $('.dropdown__button').text( $('.dropdown__list__item--selected a').text() ); }); // Scroll funktion der Navigation & Suche für mobil var myScrollNav; $(document).ready(function(){ myScrollNav = new IScroll('#mainbar', { scrollbars:false, mouseWheel:true, fadeScrollbars:false, click: true, tap: true }) $('.nav__item a').on("click", function(vv) { $(this).addClass('nav__item--clicked'); }); }); var myScrollSearch; $(document).ready(function(){ myScrollSearch = new IScroll('.head__search', { scrollbars:false, mouseWheel:true, click:true, fadeScrollbars:false }); //console.dir(myScrollSearch.options); }); function onCompletion () { // Update here your DOM setTimeout(function () { myScrollSearch.refresh(); }, 100); }; //document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);