Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
Hi Guys, thanks for a great module but I have one issue. How do I get the mini panel to work with the mouse click method?
The hover works fine but with the click method the mini panel pops up but then the page refreshed to the target url rendering the click method pretty much worthless. I had set the Path to "node" as per the tutorial. Have I missed something?
Comment | File | Size | Author |
---|---|---|---|
#12 | menu_minipanels-using_click_event-1068674-12.patch | 792 bytes | hkirsman |
#3 | menu_minipanels-using_click_event-1068674-3.patch | 580 bytes | Raphael Apard |
Comments
Comment #1
jgarbe CreditAttribution: jgarbe commentedI will echo this...I understand this is porting the qtip functionality...but if every time you click a menu item to activate the mini-panel it re-directs to that page, it seems that would totally invalidate the usefulness of that functionality.
I've looked all around in the module and couldn't find anything...perhaps what you'd want is for menu items with the click-activated mini-panel attribute to set the link to just #? I can't think of a use-case where someone would need a link in there and an on-click or double-click event, but I might not be seeing the whole picture.
Comment #2
tyler-durden CreditAttribution: tyler-durden commentedI also want this feature. If only you could have a placeholder or be able to leave the menu target blank?
Comment #3
Raphael Apard CreditAttribution: Raphael Apard commentedIf you want a link without href for this feature, you can override theme_links.
For Drupal 7 :
Change :
by
But you will find another issue :
If qtip event for show is "click", you will have to change event for hide as "unfocus" or "click".
Here the patch to do this., this is for Drupal 7
Comment #4
Raphael Apard CreditAttribution: Raphael Apard commentedComment #5
artur.martirosyan CreditAttribution: artur.martirosyan commentedThere's quick workaround, just add following line anywhere in your JS code:
$('a.menu-minipanel').click(function(e){e.preventDefault();});
this will prevent browser from following the link but popup still will be triggered
Comment #6
frank.schram CreditAttribution: frank.schram commentedHi,
I'm a bit new in this.
Could you give me an example of where to add that line in my JS code?
I tried adding this in menu_minipanels.js
but that does not seem to work.
Comment #7
PaperWeight CreditAttribution: PaperWeight commented[EDIT: Sorry, this was supposed to be in reply to Frank, above]
Hey Frank, I'm sure there is a better way, but this works for me:
(assuming Drupal 7.x here)
Open your THEME.info file, which is inside your theme directory (if your theme is called FranksTheme, then this file will be called FranksTheme.info
on a new line paste:
scripts[] = js/custom.js
and save the .info file.
In your theme directory, create a directory called 'js' (without quotes) if there isnt already one.
Inside that directory, create a file called 'custom.js' (without quotes) - I personally use that file for any Javascript tweaks I might want to add site-wide.
Open custom.js in a text editor and paste in the following code:
The jQuery ready function is detailed here.
Clear all caches at YOURSITE.com/admin/config/development/performance
And hopefully switching the Menu Minipanel to onClick will do as desired!
Comment #8
Diane Bryan CreditAttribution: Diane Bryan commentedPaperWeight, thank you for this beautiful step-by-step!
On my Zen subtheme the script does, indeed, allow that top-level link to be an on-click event. However, as soon as I move my mouse over the drop-down minipanel, it scrolls away. In other words, when my mouse *leaves* the menu link, its dropdown disappears.
Raphael's patch (just above PaperWeight's tutorial linked above) handles this and plays nice with PaperWeight's solution. However the line numbers have changed since that patch was offered. As of today, it should be inserted at line 431.
That leaves a missing functionality:
There needs to be the option to include a "close" link for the menu, for instances where the menu itself may be styled to sit on top of its parent item, or elsewhere on the page. I'm thinking of having the parent item display as graphical icons, which change from the menu icon (looks a little like =) to the close icon (looks a little like [x]).
I'll post here if I figure out a way to do that. Or suggestions are welcome.
last observation--a bug that I can't tell if it's related to these two patches, and don't have time to create a raw scenario to test it -- If I select "none" for the effect for the on-click event and for closing, the first time the menu opens, it wanders down from the upper-left corner of the screen. If I reduce the effect timing to zero, the minipanel stays in the upper left corner of the screen instead of wherever I've placed it, unless I resize my screen, at which point it "wanders" into place.
Since Drupalcon Portland is over, maybe development on the module can resume? It seems there are lots of nice suggestions that can be integrated.
Comment #9
xbrianx CreditAttribution: xbrianx commentedI also have this issue, coincidentally, I was also using Special Menu Items Module to get around a similar problem using the superfish menu and touch screen. I needed to be able to click-not hover on the menu.
After needing more with my menu I decided to try menu minipanels, but the click does not work at all when using the
<nolink>
menu option from special menu items module. And the problem is if you do put a link on the item when you click it goes to the page, rendering the functionality useless.I thought the problem might be the way the special menu item was displaying the link as it was using
<spans>
by defaut, but there were options to change the markup, and I tried<a>
figuring something was being triggered in the javascript, but that still didn't work. Click functionality is greatly needed especially when dealing with touch screens.Comment #10
steveoriolHello xbrianx,
using the module "Void Menu" with the default value for
<void1>
, it is a "#".And the "On mouse click" will working. ;-)
Comment #11
jason.fisher CreditAttribution: jason.fisher commentedA close button and close-on-document-click would be useful UX features to go along with a working click. :)
Comment #12
hkirsman CreditAttribution: hkirsman commentedI think there's no way of changing the menu link from module. So I'll create new patch and add code from #5
I don't use $(document).ready() as the script is in footer. It's faster that way.
I agree with jason.fisher (#11) that the menu should close from close button. Or in my opinion after hovering off the popup.
Patch is made in the latest stable version:
git clone --branch 7.x-1.x http://git.drupal.org/project/menu_minipanels.git
git reset --hard d2f2244cb5cfc7a2e01a777487c60c7b004d5f0a
Comment #13
DamienMcKennaShouldn't this be handled via settings and a behavior?
Comment #14
maxplus CreditAttribution: maxplus commentedHi,
I'm using Menu Minipanels v2 in combination of the Void Menu module to get my main menu link open the mini panel like described by steveoriol in #10.
=> thanks for the useful advice, I needed this for touch device functionality (iPad)
It would be great if I could also create a close button, maybe I should take a look at hkirsman #12 and make it work with Menu Minipanels v2