Jump to content

Archived

This topic is now archived and is closed to further replies.

jmad

Mobile Menu is Twitchy on Mobile (iphone, ipad, android)

Recommended Posts

jmad

on this site chrisvittpiano.wpengine.com I have the mobile menu centered and have hidden the search bar via the NavBar settings.  Then I have hidden the search bar in the mobile menu using this code.

 

/*Hide Search in Mobile Menu*/
.pl-mobile-menu .mm-search {
  display: none;
}
 
This works but makes the menu twitchy (won't stay open or takes you to a different page).  I think this has something todo with having hidden the search in the mobile menu as it now can't just target the search areas as a landing place for the cursor.  If you touch the very left edge of the menu-toggle or basically the "m" in menu then it works if you click on the icon or on any other part of the word menu then it doesn't work properly.
 
I suppose I can leave the search bar active but is there a different way to get around this?
 
I personally don't like how clicking the mobile menu icon drops the cursor into the search area.

Share this post


Link to post
Share on other sites
Danny

Hi,

 

If by using that code to hide the search field on the mobile menu makes it twitchy then you will want to remove that code. The mobile menu works fine on all the devices I've tried.

I can add this as a feature request, but in the meantime, you will either want to remove your code or use a different navigation such as UberMenu.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
jmad

That would be a great feature to have I think.  Many small sites have very little need for a search function.

 

If I'm going to have the search field/button in the mobile menu but I still don't want it in my desktop menu how do I add the search field to the footer area just by itself?

Share this post


Link to post
Share on other sites
jmad

So I took the code out and it now works on the iphone but is still twitchy on ipad (older device and newer ipad mini).  The site is chrisvittpiano.wpengine.com can you take a look at this so we can see if it's something I've done or is this a glitch?  

 

I really don't want to have to install ubermenu just for this issue. 

Share this post


Link to post
Share on other sites
jmad

Danny

 

Okay.  This photo background issue needs sorted once and for all.  I had to give up on using a DMS menu because it was unreliable but you can see the same issue on madsky1.wpengine.com (a test site).  On an ipad there is a long (3 or more second delay when switching from portrait to landscape.  It may have todo with photo size but in order to keep photo backgrounds from repeating they have to be large (like 3500px really???).  

 

Please look into this as a problem.  DMS isn't handling photos correctly somehow...I say this because in other themes I am using the exact same photos and not having these issues.  

Share this post


Link to post
Share on other sites
Danny

I don't have my iPad on me, girlfriend uses it at work. However, when I viewed PageLines.com on my iPad, I had no such issue with the navigation or switching from landscape to portrait. Is it possible for you to record the issue please.

 

You can try this (haven't tested it myself) - http://www.airsquirrels.com/reflector/


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
jmad

Okay so the photo size thing was my error...sort of and having one photo on the page that was 100+KB seemed to throw off everything..and I'll address/ask some other questions in a different post.  My main and most pressing issue is the menu twitch.....which is caused by my custom CSS but I'm not sure why and would appreciate help.

 

I want to use the menu in a template section on the homepage and the same menu in either the fixed or header sections on other pages.   I have the menu placed in the header section on the homepage and in the template section just below.

 

I have the header section on the homepage hidden via the .home code below.   site is madsky1.wpengine.com

 

Everything works until I center the mobile menu with

 

#site .nav-btn-navbar {
  float: none;
  margin-left: 45%;
  &{@media(max-width: 480px){
      margin-left: 38%;
    }
  }
}

 

then the menu gets twitchy.... how do I resolve?

 

 

.home #pl_areaua7628{
  display:none;
}
 
#site .pl-color-black-trans {
background: rgba(0, 0, 0, 0);
border: none 0;
box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
background-color: rgba(0, 0, 0, 0);
background-image: none;
}
 
#site .nav-btn-navbar, .nav-btn-navbar:hover {
font-size: 14px;
  background: rgba(0, 0, 0, 0);
border: none 0;
box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
background-color: rgba(0, 0, 0, 0);
background-image: none;
  padding: 0;
}
 
#site .section-navbar .navline {
float: none;
text-align: center;
}
 
#site .section-navbar .navline li {
display: inline-block;
float: none;
  font-size: 14px;
}
 
 
.section-navbar .navbar.pl-color-black-trans .navline > li:hover > a, .section-navbar .navbar.pl-color-black-trans .navline > li.current-menu-item > a, .section-navbar .navbar.pl-color-black-trans .navline > li.current_page_item > a, .section-navbar .navbar.pl-color-black-trans .navline > li.dropdown.open > a {
  color: #E76F4D;
  background: rgba(0,0,0,0);
}
 
 
.pl-mobile-menu {
  background-color: #062833 !important;
}
 
 
.pl-mobile-menu a{
  font-size: 12px !important;
}
 
#site .nav-btn-navbar {
  float: none;
  margin-left: 45%;
  &{@media(max-width: 480px){
      margin-left: 38%;
    }
  }
}
 
 

Share this post


Link to post
Share on other sites
Danny

Unfortunately, we do not provide extensive customization support and do not provide support for users own custom CSS issues.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
jmad

Really?  This is in the customization forum and I'd think that since I have to spend time (that I'd rather spend designing for my clients) and energy working to document DMS issues and demonstrate, in order to convince the DMS team, that there is a true problem with things like the popshot(when it's a known issue but not communicated) or the mobile menu ghosting over on mobile (again known but not reported to users as a known issue)that the least you could do is give it a quick look. 

 

Maybe I, along with the other users should start sending invoices to Pagelines for the time we spend addressing issues that should be caught in testing.  

 

This is one of the reasons I haven't settled on DMS as a reliable solution for clients.  

Share this post


Link to post
Share on other sites
Danny

There is no issue with the Mobile navigation, you say yourself the issue comes when you try and hide the search bar or use custom CSS you have created. Without this customization the mobile navigation works just fine.

 

Our staff are here to provide technical support for PageLines products, we do not provide extensive CSS support, the CSS support we do provide is usually really basic stuff that takes a couple of seconds to create. We can not go through code a users has created and see where the problems occurs. If you're having issues with customization, you should sign up to a CSS specific forum and ask for guidance there.

 

This isn't something PageLines only does, most WordPress theme providers do not provide customization support. You can find our support coverage below.

 

http://docs.pagelines.com/support-troubleshooting/getting-support

 

You will find it increasing difficult to find a WordPress theme developer/community/club that have support staff that provide extensive customization support or review user created code and see why there is an issue.

 

I am well aware that our documentation is badly needing a revision and I have this on my priority list. However, our documentation will not go in-depth on how customize all sections.

 

In my opinion the best method for you would be to create a child section and edit the functionality of the section. Rather than having to hide it via CSS.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
jmad

Danny 

 

The issue was with this one bit of code not something you had to work through,

 

#site .nav-btn-navbar {
  float: none;
  margin-left: 45%;
  &{@media(max-width: 480px){
      margin-left: 38%;
    }
  }

 

}
 

I was just looking for a suggestion which you have now provided although I think it's doable via css and will look at it more.  

 

If we are going to compare DMS to other companies, that's fine.  Where is PL's list of known issues, documentation covering basic usage and setup of DMS2?  Other companies don't release a product without having tested and retested their product, yet it's clear that DMS2 wasn't tested as well as it should have been (still enjoying using though).  Where is PLs list of known issues with sections and plugins.  When I report an issue to other theme providers then it's an issue and they work to solve...I don't have to actually work to convince them of a problem...then they resolve without asking for me to provide screen shots, etc.  

 

I'm sure you are busy and I do appreciate your support plus you guys have a good response time.  I also realize documentation is difficult and probably not all in your control.  DMS management should know better than to release a product without updated support documents (just bad business and makes no sends).  

 

Anyway, I sort this out.  Thanks.

Share this post


Link to post
Share on other sites
Danny

DMS and DMS 2.x was tested by a group of developers. We never release anything without testing, that would be insane. However, with the amount of people using DMS and DMS 2.x with the different ways they use it, there will always be issues, conflicts or bugs found no product is perfect.

 

I've already said the documentation badly needs updating, I am on this believe me.

 

In regards to reporting an potential issue/conflict/bug, we take these seriously and our staff attempt to recreate it. However, if we can't recreate your issue, then we reply to the topic asking for more information. As usually and I mean roughly 99.9% if the time, the issue/conflict is caused by pilot error or a plugin/script or code added by the user. No WordPress theme developer will take a users word as gospel when regarding a potential bug/issue/conflict, they will ask for the similar information as our staff do. If they do not do this, then there team has a lot of free time on their hands in my opinion, for the reasons I mentioned above regarding pilot error/plugins code.

 

DMS has been developed in accordance with the WordPress API, therefore the majority of plugins in the WordPress plugin repo should work unless they include some weird scripts which may or may not interact/conflict with DMS's visual editor.

 

In regards to your question about plugins/sections from the store being DMS 2.x ready, that is actually a really good idea, where we should probably have a label on the products saying DMS 2.x ready or something similar.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
jmad

Thanks for the info. 

 

Is there a thread for information we would like to see in the documentation?

Share this post


Link to post
Share on other sites
greenfly

Hello jmad

 

If you post suggestions to the feedback forum we can pick them up from there and add them to do the doc's repo http://forum.pagelines.com/forum/36-ideas-and-feedback/


The answer to many issues can be found by searching in the forum before posting as someone else  may very well have had the same problem before you have.  Also, reading the documentation can help you gain a good understanding of how everything works. 

 

Please do not send me private messages. Occam's razor - The principle states "Keep things simple!"

Share this post


Link to post
Share on other sites
jmad

Thanks.  Mark as solved.

Share this post


Link to post
Share on other sites

×