Stack Overflow
Stack Overflow

Questions tagged [popper.js]

Popper.js is a javascript library, consider also adding the Javascript tag. Popper.js used in web applications to position poppers, an element on the screen which "pops out" from the natural flow like tooltips, popovers, drop-downs. With no dependencies, no jQuery, no LoDash, it's used by Twitter in Bootstrap v4, Microsoft in WebClipper, and Atlassian in AtlasKit.

380 questions
5
votes
2 answers

How to show the arrow in popper-js

I'm trying to use popper-js, but I have a hard time reading the documentation and to get things working. I can't seem to get the arrow to show (the triangle thingy pointing to the referenceElement). The code below is narrowed down to what I'm trying…
doekman
  • 18,750
  • 20
  • 65
  • 86
5
votes
2 answers

tooltip.js popper.js usage example

As not very proficient in javascript I don't understand the tooltip.js documentation at all. Why do the not include an example for people like me? Ho do I have to install this library in order to work correctly? I add tooltip.js to webpack…
KSPR
  • 2,212
  • 4
  • 29
  • 46
5
votes
2 answers

Bootstrap 4 Popper.js edit style attribute

I'm trying to edit the position of a dropdown element but I can't seem to get it to work. I'm using Bootstrap 4 with Popper.js and I just added a default dropdown without any alternative styles to my page, but it automatically adds the following to…
Mikelo
  • 271
  • 2
  • 16
5
votes
1 answer

Bootstrap 3 - Popover in wrong position the first time page loads

Bootstrap 3 popper's container is not correctly placed on the page the first time the user 'hovers' over the element triggering it. the second time onward, works like a charm. HTML: …
Stavm
  • 7,833
  • 5
  • 44
  • 68
5
votes
0 answers

Inner positioning not working as intended in Popper-js?

I'm using Popper.js to make some dropdowns. So far, I found the library to be quite easy to use. I managed to make some cool stuff, even draggable buttons where the popper element automatically moves around the button when I approach the border of…
user7663281
5
votes
2 answers

UNMET PEER DEPENDENCY jquery@>=3.0.0 & popper.js@^1.11.0

While installing Bootstrap 4 (the latest beta version) with NPM : `npm install bootstrap@4.0.0-beta, I got this message : +-- bootstrap@4.0.0-beta +-- font-awesome@4.7.0 +-- UNMET PEER DEPENDENCY jquery@>=3.0.0 `-- UNMET PEER DEPENDENCY…
MDIT
  • 1,508
  • 5
  • 25
  • 38
4
votes
1 answer

MATERIAL-UI React - Popper of another Popper

I'm working on a calendar app. The problem: clicking popper of a popper closes both poppers, because it fires the click outside event of the first popper which closes it. I have a component which uses Material-UI React and it…
Itay Tur
  • 683
  • 1
  • 15
  • 40
4
votes
2 answers

Quickly scrolling away from hover-triggered popover does not hide popover

I am using hover-triggered popovers for certain highlighted rows in a table and when you scroll away from the element relatively quickly using the mouse scroll wheel, the popover continues to show for an extra second even though you are no longer…
Neuro_Prog
  • 77
  • 1
  • 8
4
votes
1 answer

Bootstrap 4 html tooltip is removing inline styles

I'm initializing tooltips with following code: $('.tooltip').each(function () { $(this).tooltip({ html: true, title: $('#' + $(this).data('tip')).html() }); }); Example of tooltip code:
Damian
  • 151
  • 8
4
votes
2 answers

SyntaxError: export declarations may only appear at top level of a module

I have recently installed popper.js using the below comment npm install --save popper.js angular-popper Then, I add the below in angular.json "scripts": [ "node_modules/jquery/dist/jquery.min.js", …
Anto S
  • 2,448
  • 6
  • 32
  • 50
4
votes
1 answer

Is it possible to inject react context to div outside the root in react (under the body)

I am working with react cytoscape library. Try to integrate to popper plugin of cytoscape. the popper "content" property expect to return a div element describe the popper which appended to the "body" element. Since the context provider is under…
cryptoun
  • 43
  • 6
4
votes
2 answers

How to use react-popper with render props

I am a beginner, trying to understand react-popper. On their github, this is the example code: import { Manager, Reference, Popper } from 'react-popper'; const Example = () => ( {({ ref }) => (
R. Kohlisch
  • 2,823
  • 6
  • 29
  • 59
4
votes
1 answer

react-popper: re-position using scheduleUpdate

I'm using React-popper to show a date picker element after clicking a button. JSX {({ ref }) => ( )} …
vsync
  • 118,978
  • 58
  • 307
  • 400
4
votes
2 answers

React - How to notify popper to reposition my popover whenever react updates any DOM element

Relevant versions: React 16.4.2, Bootstrap 4.1.3, popper.js 1.14.4, Typescript 3.0.3 I use the Bootstrap Popover functionality in my react app. The Popover works well if the rest of the page is static. When the page is changed (at the browser…
Shorn
  • 19,077
  • 15
  • 90
  • 168
4
votes
1 answer

Angular 6 + Popper.js (without jQuery)

I am trying to setup Popper.js to work with angular 5, without bootstrap or jquery. I tried following this https://github.com/FezVrasta/popper.js/#react-vuejs-angular-angularjs-emberjs-etc-integration, but it is not exactly a point A to B…
Karl Johan Vallner
  • 3,980
  • 4
  • 35
  • 46
1 2 3
…
25 26
1 2