He usado netbeans para desarrollo de java y me resultó bastante pesado, pero si vas a trabajar son swing es lo mejor.
Te paso los scripts.
adolfo.css
Código:
#formulario label, #datostipo label{
display:block;
font-weight:bold;
text-align:right;
width:160px;
float:left;
line-height: 40px;
}
#formulario input, #formulario select{
float:left;
font-size:12px;
padding:4px 2px;
width:200px;
margin:4px 0 10px 10px;
}
#formulario button{
clear:both;
margin-left:170px;
width:200px;
float:left;
height:30px;
text-align:center;
line-height:31px;
font-size:11px;
font-weight:bold;
}
#formulario textarea{
float:left;
font-size:12px;
padding:4px 2px;
width:200px;
margin:2px 0 10px 10px;
}
Código:
/*SECCION DE VENTANITA EMERGENTE*/
img {
border: none;
}
//----------------------------------------------
#hideshow {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
#fade {
background: #000;
position: fixed;
width: 100%;
height: 100%;
filter:alpha(opacity=80);
opacity: .80;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /*--IE 8 Transparency--*/
left: 0;
z-index: 10;
}
.popup_block {
background: #ddd;
padding: 10px 20px;
border: 10px solid #fff;
float: left;
width: 480px;
position: fixed;
top: 20%;
left: 50%;
margin: 0 0 0 -250px;
z-index: 100;
}
.popup_block .popup {
float: left;
width: 100%;
background: #fff;
margin: 10px 0;
padding: 10px 0;
border: 1px solid #bbb;
}
.popup h3 {
margin: 0 0 20px;
padding: 5px 10px;
border-bottom: 1px solid #bbb;
font-size: 1.5em;
font-weight: normal;
}
.popup p {
padding: 5px 10px;
margin: 5px 0;
}
.popup img.cntrl {
position: absolute;
right: -20px;
top: -20px;
}
/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
position: absolute;
top:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop : document.body.scrollTop);
}
*html .popup_block {
position: absolute;
top:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop
+((documentElement.clientHeight-this.clientHeight)/2)
: document.body.scrollTop
+((document.body.clientHeight-this.clientHeight)/2));
left:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollLeft
+ (document.body.clientWidth /2 )
: document.body.scrollLeft
+ (document.body.offsetWidth /2 ));
}
/*--IE 6 PNG Fix--*/
img{ behavior: url(iepngfix.htc) }
/*FIN SECCION DE VENTANITA EMERGENTE*/
Código:
//FUNCIONES PARA MANEJO DE VENTANAS.
function hideDiv() {
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('hideshow').style.visibility = 'hidden';
}
else {
if (document.layers) { // Netscape 4
document.hideshow.visibility = 'hidden';
}
else { // IE 4
document.all.hideshow.style.visibility = 'hidden';
}
}
}
function showDiv() {
if (document.getElementById) { // DOM3 = IE5, NS6
document.getElementById('hideshow').style.visibility = 'visible';
}
else {
if (document.layers) { // Netscape 4
document.hideshow.visibility = 'visible';
}
else { // IE 4
document.all.hideshow.style.visibility = 'visible';
}
}
}
//FUNCIONES PARA MANEJO DE FORMULARIOS DE ATRIBUTOS.
function cargarDetalles(){
valor = document.formulario.combotipo.value;
tipotexto = "<label>LONGITUD:</label><input type='text' name='longitud' id='longitud' tooltipText='Esto determina la longitud del campo' />";
tiponumero = tipotexto + "<label>DECIMALES:</label><input type='text' name='decimal' id='decimal' tooltipText='Esto indica cuántas cifras decimales tendrá el campo. <br /><br /> Ejemplo: <br /><br /> ->numeric(longitud, decimal) <br /><br /> -> numeric(6,2) <br /><br /> ->1234,56 <br /><br />' />";
tipofecha = "";
tipoboolean = "";
if(valor == "texto"){
document.getElementById("datostipo").innerHTML = tipotexto;
document.getElementById("longitud").focus();
}else if(valor == "numerico"){
document.getElementById("datostipo").innerHTML = tiponumero;
document.getElementById("longitud").focus();
}else if(valor == "fecha"){
document.getElementById("datostipo").innerHTML = tipofecha;
}else if(valor == "boolean"){
document.getElementById("datostipo").innerHTML = tipoboolean;
}
}
Código HTML:
<!--TEST PARA PROBAR AJAX-->
<html>
<head>
<link rel="stylesheet" type="text/css" href="adolfo.css" media="screen" />
<link rel="stylesheet" type="text/css" href="ventanita.css" media="screen" />
<script src="formus.js" type="text/javascript"></script>
<script src="miAJAXlib.js" type="text/javascript"></script>
<script language="javascript">
function usarinfo(texto){
var respuesta = texto;
document.getElementById("ventana").innerHTML = respuesta;
showDiv();
}
function mostrar(texto){
alert("MENSAJE: "+texto);
}
function alertar(){
alert("USTED HA INVOCADO UN JS COMUN");
}
</script>
</head>
<body>
<button name="boton" id="boton" onclick="doAjax('formularioAlta.php', '', 'usarinfo', 'GET', '0')">CUADRO DE DIÁLOGO</button>
<button name="boton2" id="boton2" onClick="doAjax('dimeHora.php','','mostrar','post','0')">DEL EJEMPLO</button>
<button name="boton3" id="boton3" onclick="alertar()">ALERTAR, JS COMUN</button>
<div id="hideshow" style="visibility:hidden;">
<div id="fade"></div>
<div class="popup_block">
<div class="popup">
<a href="javascript:hideDiv()"><img src="icon_close.png" class="cntrl" title="Close"></a>
<h3>Titulo</h3>
<div id="ventana"></div>
</div>
</div>
</div>
</body>
</html> Despueś hay unas librerías de ajax y demás pero con esto basta para ver lo que es maquetación que es por lo que empecé el topic.
Todo va a una misma carpeta.
Espero entiendas algo, las aspirinas corren por mi cuenta.