Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1394 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Ouvrir page dans fenêtre modale

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Ouvrir page dans fenêtre modale

n°2226216
Prav26
Posté le 25-04-2014 à 14:01:33  profilanswer
 

Bonjour à tous,

 

J'ai trouvé sur internet un script permettant d'ouvrir une fenêtre modale en html et css. J'aimerais mettre dans cette fenêtre modale une autre page en php contenant du python.

 

Où placer ma page php contenant du python dans le script avec la fenêtre modale svp ?

 

Mon script avec la fenêtre modale (test9.php) :

 
Code :
  1. <!doctype html>
  2. <!--[if lt IE 7 ]><html class="ie6" lang="en"><![endif]-->
  3. <!--[if IE 7 ]><html class="ie7" lang="en"><![endif]-->
  4. <!--[if IE 8 ]><html class="ie8" lang="en"><![endif]-->
  5. <!--[if (gte IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]-->
  6. <head>
  7. <meta charset="utf-8" />
  8. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  9. <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
  10. <meta name="robots" content="noindex, nofollow">
  11. <title>Modal Windows with HTML and CSS</title>
  12. <link rel="stylesheet" href="_/css/style.css" />
  13. <link rel="shortcut icon" href="/favicon.ico">
  14. <link rel="apple-touch-icon" href="/apple-touch-icon.png">
  15. <script src="/mint/?js"></script>
  16. <style>
  17. #wrap{
  18.  margin: 0 auto;
  19.  width: 600px;
  20.  padding: 40px 0;
  21. }
  22. /* modal wrapper */
  23. #modal-outer{
  24.  display: none;
  25.  position: absolute;
  26.  top: 0;
  27.  right: 0;
  28.  bottom: 0;
  29.  left: 0;
  30.  z-index: 9999;
  31.  background: gray;
  32.  background: rgba(0, 0, 0, .5);
  33.  filter: alpha(opacity=50);
  34.  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  35. }
  36. #modal-outer:target {
  37.  display: block;
  38. }
  39. /* modal inner */
  40. #modal{
  41.  width: 460px;
  42.  height: auto;
  43.  visibility: visible;
  44.  display: block;
  45.  /**/
  46.  z-index: 6000;
  47.  padding: 20px;
  48.  position: relative;
  49.  margin: 90px auto 40px;
  50.  overflow: visible;
  51.  background-color: white;
  52.  border: 1px solid #CCC 9;
  53.  -webkit-background-clip: padding-box;
  54.  -moz-background-clip: padding;
  55.  background-clip: padding-box;
  56.  -webkit-border-radius: 6px;
  57.  -moz-border-radius: 6px;
  58.  border-radius: 6px;
  59.  -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .4),inset 0 1px 0 rgba(255, 255, 255, .5);
  60.  -moz-box-shadow: 0 4px 12px rgba(0, 0, 0, .4),inset 0 1px 0 rgba(255, 255, 255, .5);
  61.  box-shadow: 0 4px 12px rgba(0, 0, 0, .4),inset 0 1px 0 rgba(255, 255, 255, .5);
  62. }
  63. /* modal close button */
  64. #modal a[href="#close"] {
  65.  position: absolute;
  66.  right: 0;
  67.  top: 0;
  68.  color: transparent;
  69.  font-size: 0px;
  70. }
  71. #modal a[href="#close"]:focus {
  72.  outline: none;
  73. }
  74. #modal a[href="#close"]:after {
  75.  content: 'X';
  76.  display: block;
  77.  position: absolute;
  78.  right: -16px;
  79.  top: -16px;
  80.  width: 20px;
  81.  height: 15px;
  82.  padding: 11px 7px 8px 7px;
  83.  text-decoration: none;
  84.  text-shadow: none;
  85.  text-align: center;
  86.  background: black;
  87.  color: white;
  88.  border: 3px solid white;
  89.  -moz-border-radius: 20px;
  90.  border-radius: 40px;
  91.  -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
  92.  -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
  93.  box-shadow: 0 1px 3px rgba(0,0,0,0.5);
  94.  font-size: 12px;
  95.  font-weight: bold;
  96. }
  97. #modal a[href="#close"]:focus:after {
  98.  outline: 1px solid #000;
  99. }
  100. </style>
  101. </head>
  102. <body>
  103. <div id="wrap">
  104. <p><a id="click" href="#modal-outer">Voir mesure hygrométrie</a></p>
  105. <div id="modal-outer">
  106.  <div id="modal">
  107.   <a href="#close" title="Close">Close</a>
  108.  </div>
  109. </div>
  110. </div>
  111. </script>
  112. </body>
  113. </html>
 

Mon script en php que je dois y insérer (valeur.php) :

 
Code :
  1. <!DOCTYPE html>
  2. <html>
  3.     <body onLoad="window.setTimeout('history.go(0)', 3000)">
  4.        
  5.         <?php
  6.         $output = shell_exec('python affichage.py');
  7.  echo "<pre>$output</pre>"; 
  8.         ?>                   
  9.    
  10.     </body>
  11. </html>
 

Mon script Python (affichage.py) :

 
Code :
  1. #!/usr/bin/python
  2. import serial
  3. import time
  4. locations=['/dev/ttyACM0']
  5. for device in locations:
  6.     try:
  7.         ser = serial.Serial(device, baudrate=9600, timeout=1, writeTimeout=1)
  8.         line = ser.readlines()[4].strip('\n')
  9.         print line
  10.     except Exception as why:
  11.             import pwd, os
  12.             print "Echec de connexion : %s" % why
  13.             print "whoami:", pwd.getpwuid(os.getuid())[0]
 

Si vous avez une autre solution plus simple à mon problème avec un autre langage de programmation je suis prenant :D Mais pourriez-vous svp me l'expliquer avec des détails car je ne connais que le PHP, HTML et CSS ? Merci :)


Message édité par Prav26 le 25-04-2014 à 16:01:29
mood
Publicité
Posté le 25-04-2014 à 14:01:33  profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Ouvrir page dans fenêtre modale

 

Sujets relatifs
Problème actualisation page web en arrière-planPython sur page web php
Lancer des script .vbs depuis une page HTMLOuvrir l'app concernée sur site mobile ?
Ouvrir des fichiers dont le nom est incrémenté avec scilab[VBA] Fermer une fenêtre excel ouverte dans IE
Aide formulaire d'inscription PHP page blancheBesoin d'une personne pour me créer une page accès membre.
"Cette page Web présente une boucle de redirection" ?!ouvrir une image java.
Plus de sujets relatifs à : Ouvrir page dans fenêtre modale


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR