Popup swipetoclose not working

1

This is kind of odd an I hope I’m just calling it wrong but I took the code directly from the docs here

https://framework7.io/docs/popup.html

So in my code I define the popup variable and call the open on a click event below

$$(document).on("click",".photoCard",function(){
// Create Popup with swipe to close handler
 var swipeToClosePopup = app.popup.create({
  el: '.popup-swipe-to-close-handler',
swipeToClose: true,
swipeHandler: '.my-swipe-to-close-handler',
});


swipeToClosePopup.open();

})

And the HTML is inside a page ( I call this via the route )

<div class="popup popup-swipe-to-close-handler">
<div class="block">
  <p class="my-swipe-to-close-handler"><b>Swipe works only on this paragraph</b></p>
  <p>Lorem ipsum dolor sit amet...</p>
</div>

The popup open just fine but I cant swipe to close it.

I tested the kitchen sink on device and it appears to work on the demo page so I’m not sure what I might be doing wrong here?

Thanks!

Also, just to add a little more, I console logged the popup variable and it shows the ‘swipetoclose’ option as true

image
image.png856×355 15.8 KB

2

just test it on my device galaxy s8+ and it works fine for me.

f7-v: 4.4.3

So maybe something in route. can you share the code?

3

What is odd is that code above is the code, just the boiler plate from the site or docs to test it out. It opens up just fine but the swipe to close does not trigger.

Im on an s10, not sure if it really matters on that…

4

i just add the code to one of my pages.
and on page:init, created and open the swipe to close popup

...
<div class='page-content'>
  <div class="popup popup-swipe-to-close-handler">
    <div class="block">
      <p class="my-swipe-to-close-handler"><b>Swipe works only on this paragraph</b></p>
      <p>Lorem ipsum dolor sit amet...</p>
    </div>
  </div>
</div>
...

can you make a small jsfiddle withe the issue?

5

Here is a fiddle with the code

https://jsfiddle.net/1jcomwyh/

Its basic but you can see it opens but the swipe does not work… at least for me…

I even tried placing the code directly into my page ( i usually load ajax content ) so I bypassed that an only had it on the page and again, it opens the popup but the swipe does not work

6

jsfiddle
i just init the popup and it works fine