Menue on iPad does not work (portrait mode)

• #75578

  
  Jim
  

  On December 19, 2013 at 11:53 am

  Hi,

  first of all: great theme. Thanks!!

  On my iPad 3 the menue does not work in portrait mode.
  Tested it on your demo-site (asterialite.towfiqi.com) and on my site with Chrome and Safari.
  If you click it nothing happens..

  Can you help?

  Cheers,
  Jim

  #75740

  
  Towfiq I.
  

  administrator

  On December 19, 2013 at 10:00 pm

  this is a known bug and will be fixed in the future version. Here is how to fix this:

  Open up asteria.js and replace this:

  
  if (jQuery(window).width() < 768) {
  	//jQuery("#topmenu").attr("id","sidr");
  	var padmenu = jQuery("#simple-menu").html();
  	jQuery('#simple-menu').sidr({
        name: 'sidr-main',
        source: '#topmenu'
      });
  	jQuery(".sidr").prepend("<div class='pad_menutitle'>"+padmenu+"<span><i class='fa-times'></i></span></div>");
  	
  	jQuery(".pad_menutitle span").click(function() {
  		jQuery.sidr('close', 'sidr-main')
  		preventDefaultEvents: false;
  		
  });
  }

  with this:

  //jQuery("#topmenu").attr("id","sidr");
  	var padmenu = jQuery("#simple-menu").html();
  	jQuery('#simple-menu').sidr({
        name: 'sidr-main',
        source: '#topmenu'
      });
  	jQuery(".sidr").prepend("<div class='pad_menutitle'>"+padmenu+"<span><i class='fa-times'></i></span></div>");
  	
  	jQuery(".pad_menutitle span").click(function() {
  		jQuery.sidr('close', 'sidr-main')
  		preventDefaultEvents: false;
  		
  });

  and then add this to your custom css tab:

  /*Hide the mobile menu on desktop*/
  #sidr-main{ display:none;}

  #76047

  
  Jim
  

  On December 20, 2013 at 10:02 pm

  Thanks!!

  Changed the asteria.js.
  What do you mean by the custom css tab? I added it to the style.css but this did not help..

  #76050

  
  Towfiq I.
  

  administrator

  On December 20, 2013 at 10:06 pm

  go to Asteria Options> Custom CSS

  #76209

  
  Jim
  

  On December 21, 2013 at 9:54 am

  THANKS!!!
  Works perfectly now.

  #78583

  
  Juan Cholbi
  

  On December 28, 2013 at 8:01 pm

  Sorry, how cam I open up the ASTERIA.JS?

  #78586

  
  Towfiq I.
  

  administrator

  On December 28, 2013 at 8:04 pm

  Use this plugin:
  http://wordpress.org/plugins/solid-code-theme-editor/

  #78642

  
  Juan Cholbi
  

  On December 28, 2013 at 8:49 pm

  Thank you.
  I did all the steps right but it dosn’t work…
  what can I do

  #78651

  
  Towfiq I.
  

  administrator

  On December 28, 2013 at 8:56 pm

  did you clear your ipad browser cache? whats your site address?

  #78668

  
  Juan Cholbi
  

  On December 28, 2013 at 9:13 pm

  planetasonico.hval.es
  OH YES! It is working now Thank you so much!

  #86399

  
  Mickey Kay
  

  On January 20, 2014 at 10:27 pm

  Hi there,

  We’re experiencing this same issue, however the prescribed fix doesn’t work. It seems that if the logo text is long, and the header menu is long as well, this causes the menu to move below the logo at smaller screen sizes. Since the header height is set inline with jQuery (correct? if so, why is this necessary?), the menu just disappears entirely. The only way we’ve been able to fix this problem is by decreasing the logo/menu font size to save on horizontal space, however this seems like a pretty significant issue. Can I ask why you’re doing all this breakpoint detection and styling with jQuery? Any ideas on how to fix this? Thanks.

  – MIckey

  P.S. to reproduce this issue just add a bunch of items to your nav menu and make your site title pretty long, then resize and you’ll see how the CSS/jQuery falls apart at various widths.

  #86491

  
  Towfiq I.
  

  administrator

  On January 21, 2014 at 7:15 am

  can you remove this from javascript.php and see if it works or not:

  jQuery(".header4").height(headheight)