Moble Kit pro menu issue

This forum is only for questions or discussions about working with the mojoPortal source code in Visual Studio, obtaining the source code from the repository, developing custom features, etc. If your question is not along these lines this is not the right forum. Please try to post your question in the appropriate forum.

Please do not post questions about design, CSS, or skinning here. Use the Help With Skins Forum for those questions.

This forum is for discussing mojoPortal development

This forum is only for questions or discussions about working with the mojoPortal source code in Visual Studio, obtaining the source code from the repository, developing custom features, etc. If your question is not along these lines this is not the right forum. Please try to post your question in the appropriate forum.

You can monitor commits to the repository from this page. We also recommend developers to subscribe to email notifications in the developer forum as occasionally important things are announced.

Before posting questions here you might want to review the developer documentation.

Do not post questions about design, CSS, or skinning here. Use the Help With Skins Forum for those questions.
This thread is closed to new posts. You must sign in to post in the forums.
3/13/2013 12:31:30 PM
Gravatar
Total Posts 167

Moble Kit pro menu issue

When using mobile Kit pro I noticed that in the menu you have to touch the actual word rather than the whole menu bar. However looking at the Mojo portal site in mobile view you can just touch anywhere on the menu bar to navigate.
I've updated to the latest version of mobile Kit pro and also changed the theme (whether that should make a difference)
any advice on configuring my installation of mobile Kit pro so that you can navigate by touching anywhere on the menu bar rather than just the specific word in the title. Many thanks



I noticed that  In Mobile Kit pro

3/14/2013 11:03:04 AM
Gravatar
Total Posts 18439

Re: Moble Kit pro menu issue

I'm not aware of doing anything different in Mobile Kit Pro on this site or the demo site. As far as  I know it has always required clicking the links. The only thing that might be different on this site is we are self hosting the jqueryui files with that skin so it is an older version of jqueryui.

Is your site at a public url where we could see what you mean?

4/10/2013 5:08:16 AM
Gravatar
Total Posts 167

Re: Moble Kit pro menu issue

Apologies for the delay in getting back (Easter hols etc..)

This issue happens on all my mobile sites (smartcowmarketing.com and physiotherapycroydon.com as examples) in the menu for both the mobile versions of these sites you have to select the word in the menu, whereas on the Mojoportal mobile site you can press anywhere in the bar for that menu item.

I notice that my menus have bullets beside them and yours doesn't (they were created with artisteer) could that be the issue?

Any thoughts most welcome.

4/20/2013 5:59:14 AM
Gravatar
Total Posts 167

Re: Moble Kit pro menu issue

attached are 2 links for screenshots of debugging the mobile versions:

 

The mojoportal works fine (as expected):

https://smartcowmarketing.com/Data/Sites/1/GalleryImages/mojoportalmobile.png

The smart cow one as you can see has a highlight on the about us link rather than the whole bar.  I notice that the span for the icon is greyed out in the mojoportal version and not the smart cow. This maybe if there is (or is not) an icon for the mojoportal or ar theese meant to be stripped out on the rendering of the mobile version?

https://smartcowmarketing.com/Data/Sites/1/GalleryImages/smartcowmobile.png

Any ideas

 

4/20/2013 7:47:17 AM
Gravatar
Total Posts 2253

Re: Moble Kit pro menu issue

The screenshots you shared show that the css applied to the anchor elements is nothing alike between the two sites. If you want your site to function more like mojoPortal, you should change the CSS applied to the anchors on your site to match the mojoPortal site.

I added the following in firebug and it seemed to acheive your goal:

.ui-accordion-header > a {
    display: block;
    margin-top: 0;
    padding-bottom: 7px;
    padding-left: 22px;
    padding-top: 7px;
}

.ui-icon {
    margin-top: 7px;
}

.ui-accordion .ui-accordion-header {
    padding: 0;
}

HTH,
Joe D.

4/22/2013 4:43:15 AM
Gravatar
Total Posts 167

Re: Moble Kit pro menu issue

Joe,

Many thanks for this.

I started to have a problem with trying to find jquery-ui.css to make the changes. The reason is that this is referenced and hosted by Google.

so I have added the mobilekit_V1/style.css and works a treat.

Superb

 

You must sign in to post in the forums. This thread is closed to new posts.