UI : div resizable

**MasterChief78** · 28/11/2009, 11h48

Bonjour,
Je suis en train de créer un site où j'aimerais avoir des divs qui sont draggable, handable et resizable.
Pour les deux premiers c'est bon pas de problème
Par contre, impossible de rendre un div resizable ! j'ai beau repartir du début mettre juste :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 $(document).ready(function(){
 
	$("#noteGroup2").resizable();
});

ça ne fonctionne pas, quelqu'un aurait-il une idée ?

Merci d'avance

**danielhagnoul** · 28/11/2009, 14h19

Envoyé par MasterChief78

draggable, handable et resizable

Bonjour.

Pour la division « draggable» et « resizable» pas de problème. Mais qu'est-ce qu’une division « handable», s'il vous plaît ?

Exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="Author" content="Daniel Hagnoul" />
	<title>Page type</title>
	<link rel="stylesheet" type="text/css" href="../lib/humanity/jquery-ui-1.7.2.custom.css" media="screen" />
	<style type="text/css">
		body {
			background-color:#FFFFFF;
			color:#000000;
			font-family:Arial, Helvetica, sans-serif;
			font-size:medium;
			font-style:normal;
			font-weight:normal;
			line-height:normal;
			letter-spacing:normal;
		}
		h1,h2,h3,h4,h5 {
			font-family:"Times New Roman", Times, serif;
		}
		div,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,form,table,img {
			margin:0px;
			padding:0px;
		}
		p {
			padding:6px;
		}
		ul,ol,dl {
			list-style:none;
			padding-left:6px;
			padding-top:6px;
		}
		li {
			padding-bottom:6px;
		}
 
		/* TEST */
 
		div#affiche {
			position:relative;
			top:0px;
			left:0px;
			width:400px;
			height:200px;
			margin:12px;
			padding:6px;
			border:1px solid #999999;
		}
	</style>
	<script type="text/javascript" src="../lib/jquery-1.3.2.min.js"></script>
	<script type="text/javascript" src="../lib/jquery-ui-1.7.2.custom.min.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$("#affiche").resizable().draggable();
		});
	</script>
</head>
<body>
	<div id="conteneur">
		<div id="affiche"></div>
	</div>
</body>
</html>

**MasterChief78** · 28/11/2009, 16h47

En fait je me suis mal exprimé, je voulais dire un dragable avec un hand pour le drag.
Sinon j'ai trouvé pourquoi ça ne fonctionnait pas : il suffit d'inclure le fichier css de jquery ui et voilà

Merci,

UI : div resizable

jQuery

Vue hybride

Discussions similaires

Partager

Partager