Child menu does not display on first tap when testing on iPhone

I believe it is because you have < span > as your parent menu item. Try it with a regular link and see if that works.

Hey everybody,

It's the v1.8, backup the module and the Superfish library if you've made any changes then upgrade the module to the latest development release (today's) and the library to the latest version too; however, if the parent items are <nolink> you shouldn't use the sfTouchscreen anyway.

Upgrade and let me know if it did fix it.

mehrpadin, he stated that he is using the 1.9-beta version.

justinen, are you using the 'special_menu_items' module to create your no-links?

I'm also seeing this problem on iPad and iPhone when I "Enable jQuery sf-Touchscreen plugin for this menu depending on the user's Web browser user agent"
with default user agents. I have the latest SF library installed.

tapping on first top-level item 'highlights' but does not display child menu. if I tap on a different top-level item, it displays child menu.
then I can tap on the original top-level item and it displays child menu correctly.

Steve

I am not using "special_menu_items" module.

I am using SF w/ Adaptive Theme module.

here is link to one of my development sites that shows the problem (on iPad and iPhone): drp7.rvuuf.org

I'm attaching a .pdf that shows all of my SF settings for that menu block.

(note: I would like to use the "sf-smallscreen" setting on iPhone, but it converts to a single SELECT menu, rather than to one for each top-level item, which would make the menu more manageable. I submitted this as a separate issue: http://drupal.org/node/1971300 )

Steve

Thanks to you all I've found a bunch of bugs! going to commit the fix in a few minutes.

@mehrpadin - Have you fixed this bug? I am using 7.x-1.8 and still facing the problem. Please help!

@neeraj.cms it is fixed in the dev version of the module.

I just upgraded to 1.9 (release version) and corresponding SF library.
however, first tap on my iPhone (or iPad) is highlighting, but not displaying submenu.
I have to tap on a 2nd top-level item to see its submenu, then tap on my original top item.

Sorry to reopen but this bug is not fixed.
I've tried both 7x-1.9 and the dev version and can confirm it's still not working properly on my iPad. In each case the first tap doesn't fire the drop-down but subsequent taps do.

Changing to Bug Report because it's a bug, not a support request.

From my own testing, having special-menu-items on first level parents, I can't say it totally doesn't work, it is rather not always responsive. It may also be the device, I did test on ipad (almost working) and Samsung Galaxy Tab 10.2.

I'm using The jQuery sf-Touchscreen plug-in version 1.2-beta, get the latest library here: https://github.com/mehrpadin/Superfish-for-Drupal

I'm not using special-menu-items and yet also seeing the same behavior. The difference is only that in addition to not opening up the submenu, it takes you to the page where the parent menu item links to.

I'm currently using 7.x-1.8.

Hey everybody,

I've just updated the sfTouchscreen, try the development release (today's) once updated, with the master branch of the Superfish library, let me know if it fixed it.

I can confirm it now works on iPad (iOS6) using latest dev build and latest Superfish library. Thanks!!! :)

Hi cspinbailey: are you using any third party modules - like special-menu-items?

I'm using:

• Master Branch of Superfish Library: 1.2-beta2 -> https://github.com/mehrpadin/Superfish-for-Drupal/archive/master.zip
• Superfish module version = "7.x-1.9+16-dev"
• ran update / cleared caches / reload page
• Viewing on iPhone 5 / iPad 3 iOS6

Superfish module used to (just months ago) work as follows: (and many website menus on iOS behave like this):
Tapping gently on top level: [sorry don't know the iOS terminology]: works like a hover - it opens up the submenus
Tapping hard on top level: goes to the target page

Correction:
tapping once on top level: opens up submenu
tapping again on top level: goes to target page

It would be awesome to get that behavior back again.

-- Karin

I just confirmed that when I roll the superfish library back to (superfish.bak) one that contains:

- sftouchscreen.js
-- The jQuery sf-Touchscreen plug-in version 1.0-beta.
-- It is developed as a part of the Superfish project of the Drupal CMS.

I do get the behavior I'm looking for on iOS: e.g. http://albertawhitewater.ca - check any of the menus with the downward arrows.

This is the sftouchscreen.js from the superfish.bak that is working for me:

[karin@henrietta superfish.bak]$ more sftouchscreen.js 
/*
 * sf-Touchscreen v1.0b - Provides touchscreen compatibility for the jQuery Superfish plugin.
 *
 * Developer's note:
 * Built as a part of the Superfish project for Drupal (http://drupal.org/project/superfish) 
 * Found any bug? have any cool ideas? contact me right away! http://drupal.org/user/619294/contact
 *
 * jQuery version: 1.3.x or higher.
 *
 * Dual licensed under the MIT and GPL licenses:
 *  http://www.opensource.org/licenses/mit-license.php
 *  http://www.gnu.org/licenses/gpl.html
 */

(function($){
  $.fn.sftouchscreen = function() {
    // Return original object to support chaining.
    return this.each( function() {
      // Select hyperlinks from parent menu items.
      $(this).find('li > ul').closest('li').children('a').each( function() {
        var $item = $(this);
        // No .toggle() here as it's not possible to reset it.
        $item.click( function(event){
          // Already clicked? proceed to the URI.
          if ($item.hasClass('sf-clicked')) {
            var $uri = $item.attr('href');
            window.location = $uri;
          }
          else {
            event.preventDefault();
            $item.addClass('sf-clicked');
          }
        }).closest('li').mouseleave( function(){
          // So, we reset everything.
          $item.removeClass('sf-clicked');
        });
      });
    });
  };
})(jQuery);
[karin@henrietta superfish.bak]$ 

Staying rolled back for now for our sites until I understand what's going on. :-)

-- Karin

OK, sorted things out. Now have things working with:

• Master Branch of Superfish Library: 1.2-beta2 -> https://github.com/mehrpadin/Superfish-for-Drupal/archive/master.zip
• Superfish module version = "7.x-1.9+16-dev"
• ran update / cleared caches / reload page
• Viewing on iPhone 5 / iPad 3 iOS6

Basically the older version of the sftouchscreen.js produced the behavior by default - whereas the newer module + library versions require admin/structure/block/manage/superfish/1/configure to be specifically set up for the desired sf-Touchscreen behavior.

Ok, got it now!

iPad iOS5.1.1 does not work with this solution.

The actions can be viewed in Bartik here: https://vimeo.com/76052773
and in this video: https://vimeo.com/72504447

• 1st touch, blink, no submenu
• 2nd touch, any another menu item, you get the submenu
• 3rd touch, original menu item, you get a submenu.
• /* Developer_comment_$tring == "%#$^&@&*" */

This is an open issue with iOS5.1.1 at least.
Will test with other iOS versions and Android as practical.

Oups, no, looking at the code, it is only not working if you use special item . Looking at the code in sftouchscreen.js shows how it works: ln 22 (..) menu.find('li:has(ul)').children('a') (..)

Hey everybody,

Please try the master branch of the SF library with the latest development release (today's), please also test on as many devices as possible, thank you all.

Hi mehrpadin, tried superfish for the first time today and found problems as described in this issue; sometime the submenu blinked but didn't show, when clicking on submenu item nothing happened. Only on dolphin (android 4.x), chrome worked fine.

I'm happy to say that it works updateing to latest dev. Excellent work! Thank you very much, this looks very promising.