Div JQuery

Résolu/Fermé
88av Messages postés 262 Date d'inscription dimanche 3 mars 2013 Statut Membre Dernière intervention 17 avril 2015 - Modifié par 88av le 17/01/2014 à 17:22
88av Messages postés 262 Date d'inscription dimanche 3 mars 2013 Statut Membre Dernière intervention 17 avril 2015 - 17 janv. 2014 à 17:51
Bonjour,

J'ai créer un code html / Javascript :

<html>
<head>
<title>jQuery</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>
</head>
 
<body>
 <br/><br/><br/><br/><br/><br/><br/>
<a href="" id="lien">Démarrage du super div</a>

 
<script type="text/javascript">
jQuery(document).ready(function($){
  
  $('#lien').click(function(e){
  e.preventDefault();   // On désactive le lien
  
  var new_element = jQuery('<div id="content" style="width:150px; height:150px; padding:5px; background-color:#0096E1; position:absolute; top:150px; left:300px; border: 10px solid #1800F3"><div class="description">Super div !!!</div></div>');
  $('body').append(new_element);
  $(function(){$('#content').draggable().resizable();});
   
   
 });
});
</script>
 
</body>
</html>


Mais j'ai un problème :

Quand on clique sur le lien "Démarrage du super div", le "super div" s'affiche.

Après, on peut le déplacer et le redimensionner normalement, mais, si on clique une autre fois sur le lien "Démarrage du super div", le "super div" s'affiche une deuxième fois, alors que je voudrait que le "super div" ne puisse s'afficher qu'une seule fois dans la page.

Pouvez-vous m'aidez s'il-vous-plait ?


Merci d'avance

Cordialement

Si vous avez un calcul à faire, vous pouvez aller sur mon site web...

1 réponse

88av Messages postés 262 Date d'inscription dimanche 3 mars 2013 Statut Membre Dernière intervention 17 avril 2015 7
17 janv. 2014 à 17:51
J'ai trouvé, voici le code, qui marche :

<html>
<head>
<title>jQuery</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>
</head>
 
<body>
 <br/><br/><br/><br/><br/><br/><br/>
<a href="" id="lien">Démarrage du super div</a>

 
<script type="text/javascript">

jQuery(document).ready(function($){
		
		$('#lien').click(function(e){
		e.preventDefault();   // On désactive le lien
		
	if(document.getElementById('addition')){} else {
		
		var new_element = jQuery('<div id="addition" style="width:150px; height:150px; padding:5px; background-color:#0096E1; position:absolute; top:150px; left:300px; border: 10px solid #1800F3"><div class="description">Super div !!!</div></div>');
		$('body').append(new_element);
		$(function(){$('#addition').draggable().resizable();});
			
	}		
	});
});
</script>
 
</body>
</html>

0