begin process at 2012 05 29 12:27:38
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

CSS

 > 

Général

 > 

[JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !


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

[JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

dimanche 10 août 2008 à 22:38:05 | [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

Dure

Bonjour à tous,
Voila je fais mon premier site et viens donc de me mettre à Javascript (j'ai déjà des notions de HTML et PHP/MySQL). J'aurais aimé faire une fonctions permettant d'ouvrir un document .php ou .html dans un cadre un peut à la manière de la Moodalbox.
Bien sur je n'en suis qu'au début donc je voudrais juste faire ceci sans animation, dans l'idéal comme lors de l'authentification sur CodeS-SourceS. Voila pour résumé lorsque je clique sur un lien la fenetre s'ouvre en milieu de page, le reste de la page se grisant.
Vous me direz pourquoi n'utilise tu pas la MoodalBox? Pour deux raisons:
- J'aimerais savoir faire cela par moi même.
- Elle ne fontionne pas correctement avec l'organisation de mon site.

Pour ce qui est de mon site, celui ci se compose ainsi:

<div id="conteneur">
    <div id="utilisateurs">...</div>
    <div id="nos_vins">...</div>
    <div id="actualites">...</div>
    <div id="admin">...</div>

    <table id="Tableau_01" width="999" height="750" border="0" cellpadding="0" cellspacing="0">
    ...
    </table>
</div>

Le tableau a en fait été généré par photoshop et contient les images formant le fond du site.
Les div ont été définits de façon absolue.

Voila un grand merci à tous ceux qui m'aideront et en aurant le courage .
lundi 11 août 2008 à 09:48:14 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

nicomilville

Membre Club
Salut,

Pour ouvrir une boite comme celle de code source, un div suffis avec AJAX, je m'explique :

Tu met un div (vide) dans ta page et au déclenchement d'un évènement tu met le z-index du div au dessus de celui des autre et tu me la couleur en noir et l'opacité a 30%...

Tu met un autre div et tu fais un innerHTML de ta page avec ajax !

a++

Si la réponse vous convient, pensez : Réponse acceptée !

lundi 11 août 2008 à 09:49:41 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

bultez

Membre Club

bonjour,

>>J'aurais aimé faire une fonctions permettant d'ouvrir un document .php ou .html dans un cadre
iframe
>>le reste de la page se grisant.
opacité

ch'tiot exemple ?

<html>
    <head>
        <script type="text/javascript">
            function griser(prm)
            {    document.getElementById("aff").style.display=prm;    }
        </script>
    </head>
    <body style="overflow:auto;margin:0px;">
        exemple de texte<br />
        exemple de texte<br />
        exemple de texte<br />
        exemple de texte<br />
        <input     type="button"
                   onclick="griser('inline');"
                   value="griser" /><br />
        exemple de texte<br />
        exemple de texte<br />
        exemple de texte<br />
        exemple de texte<br />
        <iframe    style="  position:absolute;   
                            top:0;                   
                            left:0;                   
                            height:100%;           
                            width:100%;
                            display:none;
                            background-color:#FFFF00;
                            -moz-opacity:0.50;
                            opacity:0.5;
                            filter:alpha(opacity=50);
                            -khtml-opacity:0.50;    "
                id="aff"
                src="une page htm ou php">
        </iframe>
    </body>
</html>


à toi d'adapter à ce que tu veux.

CordialementBul[mon Site][M'écrire]
lundi 11 août 2008 à 13:18:14 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

Dure

@Nicomilville: Je connais pas du tout l'Ajax, j'aurais donc deux question pour toi:
          - Tu me la couleur en noir et l'opacité a 30% // comment faire cela et le reste de la page est il donc désctivé?
          - Tu met un autre div et tu fais un innerHTML de ta page avec ajax ! // la je bug

@Bultez: Merci pour ton morceau de code, mais lorsque je fais le test avec :

<iframe    style="  position:absolute;  
                            top:50;                  
                            left:300;                  
                            height:20%;          
                            width:20%;
                            display:none;
                            background-color:#FFFF00;
                            -moz-opacity:0.50;
                            opacity:0.5;
                            filter:alpha(opacity=50);
                            -khtml-opacity:0.50;    "
                id="aff"
                src="Nouveau.html">

Seul l'iframe est grisé, et est il possible d'avoir une fonction dans la page affiché dans l'iframe pour revenir à la page mère?


Merci a vous.
lundi 11 août 2008 à 13:33:26 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

nicomilville

Membre Club
Réponse acceptée !
Pour le div il faut quil prenne toute la page et que le z-index soit suppérieur a celui de la page...

Donc oui ça désactive la page qui est en dessous...

Pour ajax jai fais un tuto ici, tu peus le regarder (je pense qu'il y en a d'autres)...

a++

Si la réponse vous convient, pensez : Réponse acceptée !

lundi 11 août 2008 à 13:38:45 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

Dure

@Nicomilville:
D'accord j'ai bien compris pour le div, et je me penche sur l'ajax pour comprendre comment insèrer une page html dans le div.

Merci encore, je vous tiens au jus de mon avancement ^^
lundi 11 août 2008 à 14:03:48 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

bultez

Membre Club
>>Seul l'iframe est grisé,
ben oui... puisque l'opacité est appliqué à l'iframe
soit tu adaptes la page chargée dans cet iframe,
soit tu combines iframe et div pour obtenir ce que tu veux.

>>et est il possible d'avoir une fonction dans la page affiché dans l'iframe pour revenir à la page mère?

?? pas  compris.
peut-être veux-tu "recacher" l'iframe ?
un "machin" qui fasse griser('none') dans la page affichée dans l'iframe

          Cordialement     Bul   [mon Site]  [M'écrire]
lundi 11 août 2008 à 14:19:32 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

Dure

Bon ben c'est officiel je suis nul ^^
Je n'ai meme pas trouver ton tuto....
Par contre une chose me turlupine; si jamais j'utilise cette technique, il me sera impossible de la transformer afin de pouvoir l'utiliser en incluant un simple fichier .js par exemple..

A vrai dire j'aurais voulu faire cela en javascript afin de pouvoir le réutiliser plus tard. Comme je l'ai dit, faire ma propre moodalbox ^^.
lundi 11 août 2008 à 14:21:00 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

Dure

@bultez:
En fait je voulais juste dire fermer l'iframe, mais j'ai lu que les iframe étaient plutot déconseiller
lundi 11 août 2008 à 14:43:24 | Re : [JavaScript] Créer une fenêtre intérieure à la page à la Moodalbox !

bultez

Membre Club


>>En fait je voulais juste dire fermer l'iframe,
ben... j'ai répondu ( met style.display='none' )

>>mais j'ai lu que les iframe étaient plutot déconseillées
ah bon ? par quel guru stupide ?
    tu confonds peut-être référencement d'un site, et là, franchement, je
       m'en tamponne le coquillard, et iframe !!! et ça n'a rien à voir.
1° si tu n'utilises pas ajax, qui est mis à toutes les sauces,
    et généralement inutilement [ @nico ;o)) ],
    c'est une manière de faire pour avoir une réponse du serveur
    mais un bête formulaire fait généralement mieux l'affaire !
    ajax étant fait pour renvoyer des données, pas une page
2° un div, ne va pas être au dessus de tout ( ne serait-ce que
        les select avec IE par exemple )
 
>>pouvoir l'utiliser en incluant un simple fichier .js par exemple..
aïe, aïe... tu vas te lancer dans l'interprétation de js
      dans une réponses d'ajax ! c'est TOUJOURS inutile.
      met ton .js dans la page appelante et point barre.

tu vas te compliquer la vie.... inutilement.
mais bon, c'est comme tu le sens après tout.


CordialementBul[mon Site][M'écrire]

1 2 3

Cette discussion est classée dans : javascript, créer, page, site, moodalbox


Répondre à ce message

Sujets en rapport avec ce message

page comme sur ce site [ par PBDLpc ] bonjour à tous, euh je débute en javascript, et je fais un site pour un commerçant qui a besoin d'un espace membre et donc avec identification du l'in Html / JavaScript...Je m'enmèle les pinceaux... [ par ds2kx ] Salut...voila je fais mon site et donc en INDEX c une page de garde avec le logo et un bouton ENTRER mais la quand on clique sur ENTRER j'aimerais bie Code Javascript et Frames [ par Endymion222 ] J'ai encore un problème à la con... Que je vous explique: Je développe un site totalement statique (pour des raisons techniques), et HTML/CSS/JavaScr PDF et JavaScript - envoi d'e-mail depuis une page PDF [ par JollyStone ] Bonjour, Je crée des pages PDF qui contiennent des liens de navigation, … Pas de problème pour créer un lien qui pointe directement sur une page web, iframe [ par benoitmtl ] Bonjour, Voici mon problème. J'ai une page sur mon site A qui contient un petit code JavaScript. Sur mon site B (pas sur le même serveur Interdire le javascript dans une frame [ par jeje11991 ] Bonjour,Sur une page de mon site j'affiche un autre site dans une frame, en bas de ma page, donc le code est comme ca :Le contenu de ma pageLa frameJe 3 diaporamas javascript sur une seule page web [ par zabandi ] Bonjour à tousJ'ai un sérieux problème que je ne voit pas comment résoudre même en ayant chercher des heures sous google.Je voudrai insérer 3 minis di Page blanche avec I.E 8 sur site utilisant Javascript [ par david131313 ] Bonjour, Je viens de créer un site qui comprend pas mal de java script, chose que je ne fais en général jamais car je ne maitrise pas trop ça, mais j ouvrir un lien dans un "DIV" d'une même page sans recharger les autres [ par louseb84 ] salut a tous. voilà je me suis décider a m'inscrire après avoir parcouru pas mal de poste et de codes sources sans y trouver réponse. je me suis mis Traduction de page web ...? [ par jeanmorelle ] Bonsoir, Je suis en train de construire un site web en français. Sur la page d'accueil, j'ai mis une image du drapeau anglais. Comment faire pour que


Nos sponsors


Sondage...

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 : 1,310 sec (4)

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