'How to move image with touch event?
I have a dating project. I have some logic like tinder.(like\skip\dislike) On the project we'r using vue2, laravel and vue-bootstrap. So, my problem is, when its mobile version, i have to use tinder logic(swipe for like and dislike). When i swipe left or right everything works good, but i need some UI like when swiping the img have to moove to that side.
<b-carousel
id="carousel-1"
ref="myCarousel"
v-model="slide"
:interval="0"
no-hover-pause
no-wrap
img-width="500"
img-height="500"
style="text-shadow: 1px 1px 2px #333;"
:no-touch="true"
>
<b-carousel-slide
v-if="typeof item.length=='undefined'">
<template #img>
<img
@touchstart="touchStartMethod"
@touchend="touchEndMethod"
width="500"
height="500"
:title="item.username"
:src="item.src"
:alt="item.username"
class="rounded img-fluid"
>
</template>
</b-carousel-slide>
</b-carousel>
Its my template. Everything i need is the UI. I cant add new libraries, thats why i hope on your help. Have a nice day.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|