Sujet Précédent Sujet Suivant

Drag and drop

boulika Messages postés 58 Date d'inscription lundi 11 novembre 2002 Statut Membre Dernière intervention 30 octobre 2009 - 20 avril 2006 à 19:09
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 - 27 avril 2006 à 17:44
Bonjour

Voici le code source d'une page en javascript avec des "div" a drager . Je ne sais pas comment faire pour soit :
- obtenir les coordonnées des div dans un input
- ou qu'avec un cookie cela garde toujours la meme place

Voila si quelqu'un peu m'aider ca serait super sympa . Merci beaucoup par avance.

<html>
<head>

<title>Dragging with JavaScript</title>
<link rel="stylesheet" type="text/css" href="css.css"/>
<style type="text/css">
div {
margin: 0px;
padding: 0px;
}
.verticalgridline {
padding-top: 27px;
}
.box, .handle {
font-size: 14px;
font-family: Arial, sans-serif;
border: 1px solid #aaa;
}
.box {
float: left;
padding: 0px;
width: 123px;
height: 123px;
margin: 5px;
background-color: #eee;
z-index: 1;
}
.handle {
cursor: move;
height: 14px;
border-width: 0px 0px 1px 0px;
background: #666;
color: #eee;
padding: 2px 6px;
margin: 0px;
}
.box p {
font-size: 12px;
margin: 5px 5px 10px 5px;
text-align: left;
white-space: normal;
}
#boxDrag, #boxVerticalOnly, #boxHorizontalOnly, #boxRegionConstraint,
#boxThreshold, #boxAbsolute {
cursor: move;
}
#boxAbsolute {
position: absolute;
bottom: 0px;
right: 0px;
}
</style>

<script language="JavaScript" type="text/javascript" src="core.js"></script>
<script language="JavaScript" type="text/javascript" src="events.js"></script>
<script language="JavaScript" type="text/javascript" src="css.js"></script>

<script language="JavaScript" type="text/javascript" src="coordinates.js"></script>
<script language="JavaScript" type="text/javascript" src="drag.js"></script>

<script language="JavaScript"><!--
window.onload = function() {
var group
var coordinates = ToolMan.coordinates()
var drag = ToolMan.drag()

var boxThreshold = document.getElementById("boxThreshold")
group = drag.createSimpleGroup(boxThreshold)
group.setThreshold(25)


var boxThreshold1 = document.getElementById("boxThreshold1")
group = drag.createSimpleGroup(boxThreshold1)
group.setThreshold(25)

var boxAbsolute = document.getElementById("boxAbsolute")
group = drag.createSimpleGroup(boxAbsolute)
group.verticalOnly()
group.addTransform(function(coordinate, dragEvent) {
var scrollOffset = coordinates.scrollOffset()
if (coordinate.y < scrollOffset.y)
return coordinates.create(coordinate.x, scrollOffset.y)

var clientHeight = coordinates.clientSize().y
document.getElementById("clientHeight");
var boxHeight = coordinates._size(boxAbsolute).y
if ((coordinate.y + boxHeight) > (scrollOffset.y + clientHeight))
return coordinates.create(coordinate.x,
(scrollOffset.y + clientHeight) - boxHeight)

return coordinate
})
}

//-->
</script>

</head>





drag to move

exaggerated drag threshold





drag to move

exaggerated drag threshold



<form></form>

</html>

PS si besoin de peux mette les ".js" sur un serveur.

1 réponse

Réponse 1 / 1
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
27 avril 2006 à 17:44
B

onjour...

même réponse que pour draguer fenetre je pense que cela peut t'intérésser...





A voir ZOOM SUR UNE
IMAGE

;0)
0

Discussions similaires

Drag and drop dans un tableau HTML
dedeisep2 -
bizibiz17 -

6 réponses
Drag Drop de fichiers
Popolino69 -
Frederyck -

3 réponses
Drag and drop en VBA
ankhn -
ucfoutu -

1 réponse
[javafx] drag and drop treeview
cs_quicest -
CptPingu -

9 réponses
drag and drop d'une image d'une page web lancée depuis un webbroswer
chrisledeveloppeur -
chrisledeveloppeur -

6 réponses
Rejoignez-nous