fixing the topbar jump effect on mobile and tablet

the topbar needs to have sticky class removed on page load and not just on scroll
resetting the padding styles on load as well

diff --git a/header.php b/header.php
index f033fa3..f26b190 100644 (file)
--- a/header.php
+++ b/header.php
@@ -4,7 +4,7 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title><?php wp_title(); ?></title>
-    <link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri() ; ?>/css/app.css?v=1.0.0">
+    <link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri() ; ?>/css/app.css?v=1.0.1">
     <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700' rel='stylesheet' type='text/css'>
     <link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
     <link href='https://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>

diff --git a/js/app.js b/js/app.js
index 327714b..3cb47b4 100644 (file)
--- a/js/app.js
+++ b/js/app.js
@@ -60,13 +60,15 @@ $(document).ready(function () {
     var scrollTop;
     
     if($(window).width() > 1023){
-        sticky.addClass("fixed");
+//        sticky.addClass("fixed");
        page.css("padding-top", "53px");
 //        $(slideshow).css("margin-top", "20px");
     } else  if($(window).width() < 1023 && $(window).width() > 640){
-         page.css("padding-top", "100px");
+        sticky.removeClass("fixed");
+        page.css("padding-top", "0px");
     } else {
-         page.css("padding-top", "150px");
+         page.css("padding-top", "0px");
+         sticky.removeClass("fixed");
     }
     
     $(window).resize( function () {

diff --git a/js/custom/pageSetup.js b/js/custom/pageSetup.js
index d830b27..766bcc4 100644 (file)
--- a/js/custom/pageSetup.js
+++ b/js/custom/pageSetup.js
@@ -51,13 +51,15 @@ $(document).ready(function () {
     var scrollTop;
     
     if($(window).width() > 1023){
-        sticky.addClass("fixed");
+//        sticky.addClass("fixed");
        page.css("padding-top", "53px");
 //        $(slideshow).css("margin-top", "20px");
     } else  if($(window).width() < 1023 && $(window).width() > 640){
-         page.css("padding-top", "100px");
+        sticky.removeClass("fixed");
+        page.css("padding-top", "0px");
     } else {
-         page.css("padding-top", "150px");
+         page.css("padding-top", "0px");
+         sticky.removeClass("fixed");
     }
     
     $(window).resize( function () {

diff --git a/style.css b/style.css
index dd288c4..93cc3cc 100644 (file)
--- a/style.css
+++ b/style.css
@@ -3,5 +3,5 @@ Theme Name: Petoskey.Com
 Author: Gaslight Media
 Author URI: http://www.gaslightmedia.com
 Description: A theme for Petoskey.Com
-Version: 1.0.0
+Version: 1.0.1
 */