Foundation-sites: JS: Popovers (Popups)

Created on 8 Jan 2017  ·  13Comments  ·  Source: foundation/foundation-sites

Quite similar to tooltips but still different!!!

Example: http://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_popup

Difficulty - Beginner Dropdown Revisit for F7 help wanted

Most helpful comment

Seems reasonable to me. I think this is primarily a docs update, but it might well be worth adding an option to include the nose/triangle automatically.

All 13 comments

It is called Dropdown in Foundation: http://foundation.zurb.com/sites/docs/dropdown.html ;)

Well. I think we should reopen this issue. I also stumbled over this "missing feature". I guess it should be made cleared that this commonly know Pattern of Popovers is called Dropdown in Foundation and how to add noses/triangles to dropdowns to achieve the look of popovers.

Exactly @DaSchTour
My thoughts are also the same

Poke @kball

Seems reasonable to me. I think this is primarily a docs update, but it might well be worth adding an option to include the nose/triangle automatically.

I think this is by mistake @ncoden @Owlbertz ? :point_up_2:

This issue will close once commit 3764b66 is merged into develop branch

Please have a reword in description or whatever equivalent is best as its referencing a wrong issue.

@IamManchanda Yes it is a mistake.

I Have one thing to say @kball ..... if we include (nose/triangle) this within dropdown, then this will be a bit duplicate to tooltips ( hover dropdowns )

my suggestion would be to seperate this and take it as new component
as there is quite a lot of difference b/w button dropdowns and popovers and tooltips.

Another possible direction to check - Is the implementation distinction between tooltips, dropdowns, and popovers that necessary?

Can these all be some sort of more base/foundational component with different graphical flavors?

In my view it should be different ( base/foundational component with different graphical flavors )

Agree with you @kball. There is probably plenty of things we can do to factorize these components.

The best solution would be to find a "base" component (merge of behaviors and options) which still fit the three use cases and is still simple to use.

If it is too complicated to use (have to provide a set of options at each time), we could provide:

  • Aliases: the base component with a different name and default options.
  • New components inherited from the base component.

For one or the other solution, we have to make the aliasing/inheritance explicit and clear in the documentation, to avoid to duplicate explanations.

Agree with you nico

For me dropdown can be the base component

I might be off topic but i think we should seriously consider Tether

I mean just look at this PR https://github.com/twbs/bootstrap/pull/22264 and changes
Demo => http://jsbin.com/lijalowata/edit?html,output

With this all 12 positioning elements can be used
Default: top | right | bottom | left
Optional: top left | top right | right top | right bottom | bottom left | bottom right | left top | left bottom

@ncoden @IamManchanda I think this might fall outside of the scope of F6 due to our feature freeze. Should we close it and Revisit for F7?

Was this page helpful?
0 / 5 - 0 ratings