IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Création de DIV sur clic bouton


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre actif
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2010
    Messages
    32
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Juin 2010
    Messages : 32
    Par défaut Création de DIV sur clic bouton
    Bonjour,

    en essayant de m'inspirer des tutos sur le net, j'ai créé une fonction pour rajouter une div dans la page via un clic sur un bouton mais rien ne se passe. Venant de commencer le javascript j'espère que vous serez indulgents ^^'

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    function add_bloc(){
    	var new_div = document.createElement('div');
    	new_div.style.position = 'absolute';
    	new_div.style.top = '150px';
    	new_div.style.left = '200px';
    	new_div.style.width = '50px';
    	new_div.style.height = '50px';
    	document.getElementById('box_fullpage').appendChild(new_div);//box_fullpage est une div dans laquelle je souhaite faire apparaitre la div créée
    }
    Et le code du bouton :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    <input type="button" value="Ajouter un bloc" onclick="add_bloc();" />
    En vous remerciant par avance de votre aide

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    et tu le mets dans quoi ?

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    document.getElementById('box_fullpage')
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre actif
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2010
    Messages
    32
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Juin 2010
    Messages : 32
    Par défaut
    Merci pour ta réponse rapide mais je ne suis pas sûr d'avoir compris ta précision ^^'

    box_fullpage est une div dans laquelle je souhaite faire apparaitre la div créé via le clic bouton (cf commentaire). La div box_fullpage existe déjà au chargement de la page, je récupere donc son ID pour placer la nouvelle div avec appendChild.

    Incorrect cap'taine ?

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    cette div destinataire tu lui a mis overflow scroll ?
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  5. #5
    Membre actif
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2010
    Messages
    32
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Juin 2010
    Messages : 32
    Par défaut
    Non, je n'ai rien mis d'extravagant.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
     
    #box_fullpage{
    margin-top:30px;
    margin-left:150px;
    width:1500px;
    height:1000px;
    border:1px solid black;}
    Je n'ai rien concernant new_div dans mon css par contre, les propriétés pour la nouvelle div sont instaurés dans le JS (plus clairement je n'ai pas de #new_div{position:none;} ).
    Mais la div crée étant en position:absolute, elle devrait se placer indépendamment du reste non ?

  6. #6
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Billets dans le blog
    20
    Par défaut
    Essaye de rajouter
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    new_div.style.backgroundColor = 'gold';
    histoire de pouvoir visualiser ta div vide...
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [Débutant] Ouverture de plusieurs interfaces sur clic bouton
    Par hi2238 dans le forum Interfaces Graphiques
    Réponses: 5
    Dernier message: 10/04/2012, 14h38
  2. loading gif sur clic bouton submit
    Par Invité dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 25/05/2011, 21h12
  3. Erreur avec Call() sur clic bouton
    Par ClaireDu45 dans le forum Composants graphiques
    Réponses: 22
    Dernier message: 08/02/2011, 18h35
  4. affichage text sur clic bouton + condition
    Par gazelle dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 09/02/2009, 16h36
  5. Modifier requête sur clic bouton
    Par maxime350 dans le forum VBA Access
    Réponses: 2
    Dernier message: 09/04/2008, 15h59

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo