begin process at 2012 05 29 06:13:05
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript Orienté objet (POO)

 > 

Evènements

 > 

fermer une fenetre composée de div


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

fermer une fenetre composée de div

jeudi 3 janvier 2008 à 12:04:10 | fermer une fenetre composée de div

yanimal

Bonjour tout le monde
Voila je vous explique mon probleme : nous sommes en train de créer un os en ligne et mes bases de javascript sont plus que limitées . nous avons séparés le code html du code javascript dans 2 fichiers distincts. nous avons reussi à mettre en place des fenêtres qui se déplacent mais au niveau de la fermeture c'est tout autre chose, notemment au niveau des events .
voici une partie du code :

function creer_fenetre(left,top,width,height,titre,contenu){
        var fenetre = document.createElement("div"); //Création du bloc principal
        fenetre.className="fenetre"; //On donne un attribut class à cette div
        fenetre.style.left=left+'px';
        fenetre.style.top=top+'px';
        fenetre.style.width=width+'px';
        fenetre.style.height=height+'px';
                                         if(document.all) fenetre.attachEvent("onmousedown",function (){premier_plan(fenetre)});
                                         else fenetre.addEventListener("mousedown",function (){premier_plan(fenetre)},true);

        //On créé de la même manière la div "haut":
        var haut = document.createElement("div");
        haut.className="haut";


                               //Pour mousedown
                                 addEvent(haut,"mousedown",function (event){commencer_deplacement(event,fenetre)});

                               //Et pour mouseup
                                 addEvent(haut,"mouseup",arreter_deplacement);


        //On créé ensuite les trois div qui seront dedans:
        var haut_gauche = document.createElement("div");
        haut_gauche.className="haut_gauche";
        var haut_droite = document.createElement("div");
        haut_droite.className="haut_droite";
        var haut_centre = document.createElement("div");
        haut_centre.className="haut_centre";

                                            // titre dans barre de titre et association dans le bloc
                                            haut_centre.setAttribute("style","text-align:center");
                                            var titre = document.createTextNode(titre);

                                    haut_centre.appendChild(titre);
        var haut_reduire = document.createElement("div");
        haut_reduire.className="haut_reduire";
                                            haut_reduire.innerHTML='<img src="http://ajylaka.free.fr/logiciels/images/reduire.gif" />';
        var haut_fermer = document.createElement("div");
        haut_fermer.className="haut_fermer";
                                             //Pour mousedown
                       document.getElementById("haut_fermer").onclick = fermer_fenetre;
                                                   //haut_fermer.onclick = function() {    fermer_fenetre(fenetre)};    c'est ici que ca commence a pecher, je n'arrive pas a faire un event qui fonctionne malgre plusieurs essais : serais ce du au fait qu il y a deja un event associe a la partie "haut" ?
                                                //addEvent(haut_fermer,"onclick",function (event){fermer_fenetre(event,fenetre)});

                                            haut_fermer.innerHTML='<img src="http://ajylaka.free.fr/logiciels/images/fermer.gif" />';
                                               //Pour mouseclick
                                                 //addEvent(haut_fermer,"mouseup",arreter_deplacement);
         //Puis on les insère une par une dans notre bloc "haut":

        haut.appendChild(haut_gauche);
        haut.appendChild(haut_droite);
        haut.appendChild(haut_fermer);
        haut.appendChild(haut_reduire);
        haut.appendChild(haut_centre);


        //On insère le tout (la div "haut" et les trois div à l'interieur) dans le bloc "fenetre":
        fenetre.appendChild(haut);

        //On fait de même pour la div "milieu"
        var milieu = document.createElement("div");
        milieu.className="milieu";
        var milieu_gauche = document.createElement("div");
        milieu_gauche.className="milieu_gauche";
        var milieu_droite = document.createElement("div");
        milieu_droite.className="milieu_droite";

                                                //Pour mousedown
                                                addEvent(milieu_droite,"mousedown",function (event){commencer_agrandissement(event,fenetre)});

                                                //Et pour mouseup
                                                addEvent(milieu_droite,"mouseup",arreter_deplacement);

        var milieu_centre = document.createElement("div");
        milieu_centre.className="milieu_centre";
                                                chargeZone(contenu, milieu_centre)
        milieu.appendChild(milieu_gauche);
        milieu.appendChild(milieu_droite);
        milieu.appendChild(milieu_centre);
        fenetre.appendChild(milieu);

        //On fait de même pour la div "bas
        var bas = document.createElement("div");
        bas.className="bas";
        var bas_gauche = document.createElement("div");
        bas_gauche.className="bas_gauche";
        var bas_droite = document.createElement("div");
        bas_droite.className="bas_droite";
        var bas_centre = document.createElement("div");
        bas_centre.className="bas_centre";
        bas.appendChild(bas_gauche);
        bas.appendChild(bas_droite);
        bas.appendChild(bas_centre);
        fenetre.appendChild(bas);

        premier_plan(fenetre);
        document.body.appendChild(fenetre); //On insère le tout dans notre document, dans le corps
}

function fermer_fenetre {         ca peche egalement ici : je n'ai pas pu faire de veritable test sur cette fonction, et je ne suis meme pas sur qu'il y est besoin du parametre de la fenetre
        //haut.parentNode.parentNode.removeChild(haut.parentNode);
        removeChild(haut.parent);
        removeChild(milieu.parent);
        removeChild(bas.parent);


en vous remerciant d'avance pour votre aide
vendredi 4 janvier 2008 à 13:09:56 | Re : fermer une fenetre composée de div

PetoleTeam

Membre Club
Bonjour,
pourquoi ne pas se servir de innerHTML de la fenêtre pour initialiser son contenu...
var fenetre = document.createElement("div");
fenetre.innerHTML  = '<div id="haut">....<\/div>';
fenetre.innerHTML += '<div id="haut_gauche">... <\/div>';
...etc...

il te faut dans ce cas lui mettre un ID que tu utilise dans le DIV de fermeture...
fenetre.innerHTML += '<div id="haut_fermer" onclick="fermer_fenetre(' +fenetre.id +');">... <\/div>';
la fonction de fermeture devient dans ce cas 
//----------------------------
function fermer_fenetre( div_){
  var Obj = document.getElementById( div_);
  var Parent = Obj.parentNode;
  Parent.removeChild( Obj);
}


tu peux également utiliser la réf. de l'objet fenêtre directement
la fonction de fermeture devient dans ce cas 
//----------------------------
function fermer_fenetre( obj_){
  var Parent = obj_.parentNode;
  Parent.removeChild( obj_);
}
Sans préjuger  du reste...
;0)
dimanche 6 janvier 2008 à 20:20:10 | Re : fermer une fenetre composée de div

yanimal

merci beaucoup ... je vais tenter d'y adapter comme ca ...
oui je sais c'est pas du code bien terrible mais a la base je n'ai absolument aucune bases de javascript .. c'est tout adapté de tutoriaux et infos prises sur le net
lundi 7 janvier 2008 à 19:08:40 | Re : fermer une fenetre composée de div

PetoleTeam

Membre Club
Bonjour
oui je sais c'est pas du code bien terrible
bien au contraire il respecte le W3C, mais il faut avouer que cela devient un peu lourd alors qu'avec un innerHTML, qui n'est pas une propriété W3C, les choses deviennent plus aisées.

Il y a quelques erreurs comme l'appel à document.getElementById("haut_fermer") alors que l'élément n'est pas encore ajouter au document...

Il est préférable de passer par des fonctions anonymes,comme tu l'as d'ailleurs écrit
haut_fermer.onclick = function() { fermer_fenetre(fenetre)};
la fonction fermer étant incomplète...

Tu n'en étais pas loin, et avec un minimum de correction cela aurait été bingo...
Bonne continuation...
;O)



Cette discussion est classée dans : fenetre, div, haut, bas, milieu


Répondre à ce message

Sujets en rapport avec ce message

recherche javascript fenetre flottante bas droit [ par redbrain ] bjr, je cherche un javascript qui permette de mettre dans une page html, une fenetre dans un coin en bas et a droite (ou s'affiche une autre page ht Position d'un DIV toujours en haut [ par fcdconnect ] Bonjour !j'aimerai savoir comment positionner un toujours en haut d'une fenetre meme apres un scroll...merci d'avance Position d'un DIV toujours en haut [ par fcdconnect ] comment avoir un toujours en haut de la page meme apres un scroll:þmerci Menu coulissant de haut en bas [ par abbaye ] Bonsoir,Je voudrai faire en sorte que mon tableau qui contient les différents liens (menu) vers les autres pages de mon site coulisse de haut en bas q popup au milieu de la fenetre 'mere' [ par vrem ] Bonjour,J'aimerai savoir comment afficher un popup au milieu de la fenetre appelante...Merci pour vos reponses. Quel Code pour se résultat [ par jeanlululu ] Bonjour.Merci pour l'aide que vous pourrez nous apporter.Voila ma question. Je désire trouver le code javascript pour obtenir le résultat suivant:Je d Comment faire pour fermer une fenetre div ? [ par rich25200 ] Bonjour, j'ai ce code :         Authentification       <TABLE style="WIDTH: 280 redimensionnement dynamique div [ par elanspeech ] Bonjour,J'utilise des calques (div) pour faire des menus deroulants et j'aimerais que la largeur de mes calques s'adaptent a la taille de la fenetre d texte défilant de bas en haut [ par fifi_pipo ] bonjour,je cherche un script JS permettant de faire défiler un texte de bas en haut avec une pause entre deux textes differents.merci. défilement de bas en haut [ par moha007 ] bonjour les amisj'ai créé un système de news en php et je veux que mes news s'affichent ds une case, mais le prob, je veux qu'ils défilent de bas en h


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,686 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales