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
0
votes
1 answer

Popper.js how to tooltip slot element?

I have question. How to make possible what Poppers.js tooltip shows around element(popcorn) what is passed thru ? I am using- Vuejs, Nuxt, typescript for my webpage otherwise it "sticks" around div element and tooltip showing is wrong .(check images…
Nyuokimi
  • 149
  • 1
  • 12
0
votes
0 answers

Add Close Button to Vue with Popper.js Modal Component

UPDATED Here is a codesandbox recreating the issue - Modal Does not hide: https://codesandbox.io/s/vue3-popperjs-modal-64762?file=/src/components/Modal.vue I am new to Vue and cannot figure out how to Close the modal from the Hide Modal button…
Anthony Bird
  • 200
  • 2
  • 7
0
votes
2 answers

Graphical issues with tippy.js (popper.js) resulting from positioning with transform in Chrome

Inside a tippy-js v6.3.7 tooltip, I have a 1px height div with background-color: #333. The div is randomly appearing blurred on some tooltips and not others. Removing the transform property on data-tippy-root fixes it but positions the tooltip in…
Vael Victus
  • 3,966
  • 7
  • 34
  • 55
0
votes
0 answers

How could I possibly include or import bootstrap installed with npm and all its dependencies from the node modules in to my node-express application?

I am building a node and express application, I installed all the dependences including bootstrap jquery and popper.js with npm. Now I have a challenge of how I could really include or import all these dependences to be in use in my project
sisonke
  • 1
  • 1
0
votes
1 answer

Navbar-Toogle Bootstrap 5 not working (with Angular)

my console show me this error , it's about popper js . this is the error , and i think because of that my toggle button is not working scripts.js:7 Uncaught SyntaxError: Unexpected token 'export' export default Popper; and this is my html…
Yass Ess
  • 33
  • 1
  • 8
0
votes
0 answers

cant add bootstrap-carousel for my React App

I copied carousel code in bootstap react page. it gave this error : ./node_modules/bootstrap/dist/js/bootstrap.esm.js Module not found: Can't resolve '@popperjs/core' in ..... .However, I did install popper.js by typing npm install popper.js Also…
Yasmin
  • 57
  • 1
  • 6
0
votes
1 answer

Popper/Tippy prohibit overflow of other elements

I'm using Tippy to create tooltips for options that configure a belt, but the tooltip overlaps the belt preview (See below). It currently looks like this, when it overflows the main belt preview: http://snpy.in/Btw2ZP But I'd like to adjust the…
HenrijsS
  • 656
  • 4
  • 25
0
votes
3 answers

bootstrap4 popover is not working with html

I have updated bootstrap with 4.6.0 all of sudden my previously working popover is stopped working. I have placed popper.min.js also, but still not able to fix my issue.
HAREESH PONNAM
  • 21
  • 7
0
votes
1 answer

How to make React-Material-UI Popper draggable?

I want to dynamically change Popper position on the screen with react-draggable. Here's my code: import PopupState, {bindPopper, bindToggle} from "material-ui-popup-state"; ... return (
Jakub Słowikowski
  • 1,063
  • 1
  • 8
  • 13
0
votes
0 answers

How to install popper.js to use with bootstrap?

I want to use bootstrap locally, but I need the jquery.min.js and popper.min.js files for bootstrap to work ok. I don't see the popper file in the official page enter link description here I don't want to use CDN, I want it locally. Any idea to do…
marta5545
  • 23
  • 5
0
votes
0 answers

Cytoscape popper element always overflow

I am using cytoscape + popper.js 1.16. I am trying to set overflow hidden for the popper elements but to no avail. If I scroll graph to the: top - popper elements are shown over panel 1 and I want to be hidden - . right - x-axis scroller is shown…
user1781328
  • 48
  • 7
0
votes
0 answers

Bulding a grid with available elements and forms Popper Js and what?

I got stuck. Planning to build a page with a grid which show you avaialble information about each of the square. As example, in real estate niche, let's take this example. Having 'a lot' of lands divided by parcels, and once you hover on each…
Alex
  • 1
0
votes
1 answer

Can't get Bootstrap Tooltips and Modal to work together

I'm hoping someone might be able to help me with this issue that I've been struggling with for hours. I’m developing a .NET Core application using Visual Studio. I’m trying to use the Bootstrap Tool Tips which leverages Popper. When I get the…
Val
  • 99
  • 1
  • 11
0
votes
1 answer

Fix tooltip to selection, don't move when scrolling

I use popper.js to attach a tooltip to a text selection. function generateGetBoundingClientRect(rangeRect) { return () => ({ width: rangeRect.width, height: rangeRect.height, top: rangeRect.top, right:…
nehalem
  • 397
  • 2
  • 20
0
votes
1 answer

How to determine Translate Y positioning with PopperJS

I am creating a drop-down control as a reusable web component and I decided to use PopperJS to handle the positioning of the drop-down items. I am experimenting with sub-items, I've created a little check to determine the placement: placement:…
Luke T O'Brien
  • 2,565
  • 3
  • 26
  • 38
1 2 3
…
25 26