Click on menu icon scroll up automatically in mobile

Hi
with this template, when I click in the menu, all page is scrolling up automatically. You can test it in your demo.

Could you help me to fix it please?

Thanks in advance

Regards

This is a really strange bug. I'll report it to our devteam and will let you know as soon as I get an answer.

Thanks Ciberek

I hope for your news soon

FYI: this bug is only in Safari for iOS (iPhone and iPad)

We did some analysis on that issue and it looks like a strange bug in iOS8&9 safari while focus is set on a select element.
We will implement a fix that should at least make it behave a little better. You can try it by yourself.
Please edit this file:
/templates/gk_simplicity/js/gk.menu.js
and modify its beginning so it looks this way:

Code: Select all

jQuery(document).ready(function() {
   // Fix for iOS devices with iOS >= 8.0
   var menuWrap = jQuery('#gkMenuWrap');
   
   if(menuWrap.length) {
      jQuery(window).on('scroll', function(e) {
         if(menuWrap.hasClass('active')) {
            menuWrap.css('top', jQuery(window).scrollTop());
         } else {
            menuWrap.css('top', '-100px');
         }
      });
   }

   // Code for main menu
   if(jQuery('#gkExtraMenu')) {
           // fix for the iOS devices     
           jQuery('#gkExtraMenu ul li span').each(function(el) {
               el.attr('onmouseover', '');
           });


(part starting with // Code for main menu should already be there)
and next please edit this file:
/templates/gk_simplicity/css/menu/menu.css
and find this part:

Code: Select all

/* Fixed menu */
#gkMenuWrap {
    background: #fff;
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .26);
    -moz-box-shadow: 0 0 6px rgba(0, 0, 0, .26);
    box-shadow: 0 0 6px rgba(0, 0, 0, .26);
    height: 70px;
    left: 0;
    position: fixed;
    top: -100px;
    width: 100%;
    z-index: 1001;
}
.imageBg #gkMenuWrap {
    -webkit-transition: top .2s ease-out;
    -moz-transition: top .2s ease-out;
    -ms-transition: top .2s ease-out;
    -o-transition: top .2s ease-out;
    transition: top .2s ease-out;
}


and change it to:

Code: Select all

/* Fixed menu */
#gkMenuWrap {
    background: #fff;
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .26);
    -moz-box-shadow: 0 0 6px rgba(0, 0, 0, .26);
    box-shadow: 0 0 6px rgba(0, 0, 0, .26);
    height: 70px;
    left: 0;
    position: absolute;
    top: -100px;
    width: 100%;
    z-index: 1001;
}


Perfect now!

Thanks a lot for your help

little bug in this modif.

Menu blinks when scrolls.

Could you take a look please?

thanks in advance

Could you please post an url to your site?

Hi,

would you please tell me how i can enable scroll on my main page in order to see all menu when i do scrolling on main page.

regards

@tayyabnono please create a separate forum thread as it seems your question doesn't correspond to original topic.