Skip to main content
mitsukif
mitsukif
Known Participant
March 19, 2020
Answered

[Prototype]- Menu dropdown with hover effect

  • March 19, 2020
  • 3 replies
  • 3793 views

Hi there,

I'm wondering if we could achieve a menu dropdown with hover trigger?

 

The problem I'm struggling is...
When I hover over the item, the hover area expands and it covers the next item. Then the next item won't work when I move the mouse to the next.

 

I'd appreciate if you could advise! Thanks 🙂

 

 

{Renamed By MOD}

    This topic has been closed for replies.
    Correct answer Peter Villevoye

    The current implementation is flawed: XD creates one rectangular interactive area in that hover state, across and on top of the whole menu, indeed blocking all other elements. That's technically not how a real website or app would be working, but that's how XD works at this moment... 😞

    3 replies

    Luca Rosaldi
    Luca Rosaldi
    Participant
    September 10, 2020

    Hello, I think that the solution might be making it possible for interactions with one component to change the state of other components.

     

    i.e. hover over a button component changes the opacity (or position, or whatever) of a specific dropdown component.

     

    That would allow for this specific interaction to work, and also for plenty of other use cases.

     

    User voice thread for this feature: https://adobexd.uservoice.com/forums/353007-adobe-xd-feature-requests/suggestions/38959297-allow-components-event-to-change-states-of-other-c

      HARSHIKA_VERMA
      Community Manager
      HARSHIKA_VERMACommunity Manager
      Community Manager
      September 10, 2020

      Hi Luca,

       

      Thanks for sharing your thoughts and sharing the uservoice link for this feature. This will help our customers to upvote the request to add their voice.

       

      Thanks,

      Harshika

      Peter Villevoye
      Community Expert
      Peter VillevoyeCommunity Expert
      Community Expert
      March 20, 2020

      Your suffering from the same flaw as described in this discussion:

      https://community.adobe.com/t5/adobe-xd/how-to-use-multiple-hover-states-within-a-component-in-adobe-xd/m-p/10981726

      It's technically working as expected (from an XD developer's viewpoint), but it's not working elegantly or as expected from an XD user's viewpoint, and not as a final product would be expected and able to work.

      So the only thing you can do, is mimic some predefined steps in hovering over the menu. It won't be able to work 'for real' (yet).

        mitsukif
        mitsukifAuthor
        Known Participant
        March 23, 2020

        Sorry I couldn't get it... Do you mean it's not yet achievable yet?
        Or if not, could you please provide the similar example?

        Peter Villevoye
        Community Expert
        Peter VillevoyeCommunity ExpertCorrect answer
        Community Expert
        March 23, 2020

        The current implementation is flawed: XD creates one rectangular interactive area in that hover state, across and on top of the whole menu, indeed blocking all other elements. That's technically not how a real website or app would be working, but that's how XD works at this moment... 😞

          Rishabh_Tiwari
          Community Manager
          Rishabh_TiwariCommunity Manager
          Community Manager
          March 20, 2020

          Hi there,

           

          Thanks for reaching out. I'd like to inform you that it's working as expected as the component's bound includes the area of the menu bar. Feel free to submit your feedback about this use case here: https://adobexd.uservoice.com/

           

          Regards

          Rishabh

            Terms & ConditionsAccessibility statement
            Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices