Rendre l'image déplaçable à la souris déplaçable sur tactile
Résolu
sallix
Messages postés
7
Date d'inscription
Statut
Membre
Dernière intervention
-
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour,
je viens vers vous car j'ai besoin de votre aide, je ne parviens pas à faire de la même chose en tactile, c'est à dire :
j'ai un bouton qui crée une image et celle-ci peut être déplacée librement dans une div. je cherche un moyen pour que cela fonctionne aussi.
S'il vous plaît si vous avez des solutions je suis preneur !
j'ai déjà essayé des addEventListener touch (start, move...) mais je suis pas sur de bien les utiliser...
//html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>
<div class="container">
<div class="description">
<div id="myDiagramDiv" draggable="true" style="width: 70vw; height:100vh; background-color: #DAE4E4;opacity: 80%;"></div>
</div>
</div>
<div class="box">
<div class="partieButton">
<div class="buttonCreate" >
<button type="button" class="buttonImg" onclick="addimageBouchon();"><img src="https://votrenourrice.fr/img/bouchon.svg" height ="40" width="40" alt="bouchon" /></button>
</div>
</div>
</div>
//css
.box{
background: linear-gradient(60deg, #080808, #606060);
border: 2mm ridge #696969;
opacity: 99%;
padding: 15px;
overflow-y: auto;
width: 20vw;
animation: animate 4s linear infinite;
}
.box div h2{
text-align: center;
color: orange;
text-decoration: underline;
}
.box div p{
text-align: center;
color:palegoldenrod;
text-decoration: underline;
font-size: 0.8em;
}
.partieButton{
display: flex;
flex-wrap: wrap;
justify-content:center;
}
.buttonCreate{
margin: 3px;
box-shadow: 3px 3px ;
border-radius: 6px;
}
//script
function addimageBouchon() {
var img = document.createElement("img");
img.src = "https://votrenourrice.fr/img/bouchon.svg";
img.height = 50;
img.width = 50;
var class_name = "buttonImg";
img.setAttribute("class", class_name);
document.getElementById("myDiagramDiv").appendChild(img);
$(img).draggable();
}
A voir également:
- Rendre l'image déplaçable à la souris déplaçable sur tactile
- Comment activer le pavé tactile sans souris - Guide
- Comment déplacer une colonne sur excel - Guide
- Image iso - Guide
- Déplacer la barre des taches windows 11 - Guide
- Comment rendre un fichier moins lourd - Guide