No puedo poner contenido jquery mobile.

satjaen · #1 (**permalink**) 29/09/2013, 12:59

Hola, tengo este código que funciona bien pero quisiera meter contenido con estilo jquery mobile en el div con id wrapper que es el primer div que se ve cuando se abre el código y en el que esta el botón para abrir el popup :

Código Javascript:

Ver original<div id="wrapper">
       
        <h1><a href="javascript:void(0);" title="Abrir PopUp" id="abrirPop">Abrir PopUp</a></h1>
 
    </div><!-- #wrapper -->

Código Javascript:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PopUp Div</title>
<!-- jQueryMobile -->
<script type="text/javascript" src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
 
<!-- Optional Mousewheel support: http://brandonaaron.net/code/mousewheel/docs -->
<script type="text/javascript" src="../PATH/TO/YOUR/COPY/OF/jquery.mousewheel.min.js"></script>
 
<script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.core.min.js"></script>
<script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/latest/jqm-datebox.mode.calbox.min.js"></script>
<script type="text/javascript" src="http://dev.jtsage.com/cdn/datebox/i18n/jquery.mobile.datebox.i18n.en_US.utf8.js"></script>
<link href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
<script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js" type="text/javascript"></script>
<link href="date-picker/css/datepicker.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="date-picker/js/lang/es-es.js"></script>
<script type="text/javascript" src="date-picker/js/datepicker.js"></script>
<link rel="stylesheet" href="mobile.css/intervencionesdetalles_pendiente_cobro.css" />
 <script src="/path/to/jquery.js" type="text/javascript"></script>
<script src="/path/to/jquery.ui.draggable.js" type="text/javascript"></script>
 
<script src="/path/to/jquery.alerts.js" type="text/javascript"></script>
<link href="/path/to/jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" />
<!-- /jQueryMobile -->
 
<link rel="stylesheet" type="text/css" href="css/reset.css" media="all" />
<link rel="stylesheet" type="text/css" href="css/estilos.css" media="all" />
<script language="javascript" type="text/javascript" src="javascript/jquery-1.3.2.min.js"></script>
<script language="javascript" type="text/javascript" src="javascript/csspopup.js"></script>
<!--[if IE]>
<style type="text/css" media="all">
    #capaPopUp  {filter:alpha(opacity=65);}
</style>
<![endif]-->
</head>
<body>
    <div id="capaPopUp"></div>
    <div id="popUpDiv">
        <div id="capaContent">
            <div>
            
            
              
        
               
            </div><!-----------------------------------------------------fin contenido ------------------------------------>
            
    <article>
<form id="frm_filtro" method="post" action="<?php echo $editFormAction; ?>" name="form1">
  
    <div id="principal" data-role="page" data-theme="b">        
 
 
 
        <div data-role="header" data-position="fixed" data-fullscreen="false" data-theme="a">
 
            <h1>Datos del usuario&nbsp;|&nbsp;|&nbsp;<?php echo $row_Recordset1['id_aviso']; ?></h1> 
 
<a href="intervencionesdetalles.php?id_aviso=<?php echo $row_Recordset1['id_aviso'];?>" onClick="AplicarCambios('inicio')" data-icon="home" data-iconpos="notext" data-theme="c" data-ajax="false" class="ui-btn-right"></a>
 
<a href="javascript:void(0);"  data-icon="delete" id="cerrar" data-iconpos="notext" data-theme="c" data-ajax="false" class="ui-btn-left"></a>
 
        </div>        
 
 
 
        <div align="center" data-role="content" id="usuario">
 
 
        <div align="left" style="width:100%;max-width:600px"> 
 
        <div class="ui-bar-b ui-corner-all ui-shadow" style="padding:1.0em;" data-role="collapsible-set">
 
            <!--
 
            <div class="ui-bar-a ui-corner-all ui-shadow" style="padding:1em;margin-bottom:10px;" data-role="collapsible-set">
 
                <strong>Datos Usuario</strong>
 
            </div>  
 
            -->      
 
                 
 
                <div data-role="collapsible" data-collapsed="false">
 
               <h3>Datos personales</h3>               
 
                <!-- *********************Datos del cliente*******************-->
 
                    <!-- Nombre -->
 
                    <div style="clear:both">
 
                        <div style="text-align:left;float:left;width:30%;height:40px;padding-top:5px">
 
                            Nombre                        </div>
 
                        <div style="float:left;width:70%;height:40px">
<input type="text" name="name" id="name" value="<?php echo utf8_encode($row_Recordset1['name']); ?>" onBlur="this.value=this.value.toUpperCase();v28(this.value, this.name);"/> 
                       
 
                        </div>                        
 
                    </div>                    
 
                  
                             
                    </div>                   
 
        </div>  
  
                             
 </div>
 
 
        
      
        <!-- /content --> </div>  
 
      
    <!-- /page -->
</article>
  
            
        </div>
    </div>
    <div id="wrapper">
       
        <h1><a href="javascript:void(0);" title="Abrir PopUp" id="abrirPop">Abrir PopUp</a></h1>
 
    </div><!-- #wrapper -->
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-3621330-3");
pageTracker._trackPageview();
} catch(err) {}</script>
</body>
</html>

Gracias