Universidad de Cantabria. JavaScript
|
|
- Consuelo López Aguilar
- hace 8 años
- Vistas:
Transcripción
1 Universidad de Cantabria JavaScript Fco Javier González Ortiz Directorio Tabla de Contenido Inicio Artículo Copyright c 2006 gonzaleof@unican.es Actualizado el: D.L.:SA ISBN: 2.00
2 1. Hojas de Estilo 1.1. Dando estilo a una página 1.2. Dando estilo a varias páginas Tabla de Contenido 2. JavaScript 2.1. Introdución 2.2. Diferencias entre Java y Javascript 3. Variables y Funciones 3.1. Variables Globales y Locales 3.2. Operadores Aritméticos y Lógicos 4. Condición If...Else 5. Bucle For 6. Bucle switch 7. Objetos en javascript 7.1. Clase String 7.2. Clase Date 8. Eventos en Javascript 9. Capas en HTML
3 Sección 1: Hojas de Estilo 3 1. Hojas de Estilo En las páginas web se mezcla en su código HTML el contenido del documento con las etiquetas necesarias para darle forma. Esto tiene sus inconvenientes ya que la lectura del código HTML se hace pesada y difícil a la hora de buscar errores o depurar las páginas. Aunque, desde el punto de vista de la riqueza de la información y la utilidad de las páginas a la hora de almacenar su contenido, es un gran problema que estos textos estén mezclados con etiquetas incrustadas para dar forma a estos: se degrada su utilidad. En estas páginas de CSS pretendemos dar a conocer la tecnología con un enfoque práctico para que en pocos capítulos podáis usar las CSS de una manera depurada. No pretendemos explorar todos los aspectos de la tecnología ya que para realizar esto necesitaríamos la extensión de un libro entero. El modo de funcionamiento de las CSS consiste en definir, mediante una sintaxis especial, el diseño de presentación que se puede aplicar a: Un sitio web entero, de modo que se puede definir su estilo de una sola vez. Un documento HTML o página, se puede definir la forma, en un pequeño trozo de código en la cabecera, a toda la página. Una porción del documento, aplicando estilos visibles en un trozo de la página. Una etiqueta en concreto, llegando incluso a poder definir varios estilos diferentes para una sola etiqueta. Esto es muy importante ya que ofrece potencia en nuestra programación.
4 Sección 1: Hojas de Estilo 4 Podemos definir, por ejemplo, varios tipos de párrafos: en rojo, en azul, con márgenes, sin ellos Dando estilo a una página <head> <title>ejemplo de estilos para toda una página</title> <STYLE type="text/css"> <!-- H1 {text-decoration: underline; text-align:center P {font-family:arial,verdana; color: white; background-color: black BODY {color:black;background-color: #cccccc; text-indent:1cm A:link {text-decoration:none;color:#ffffff; A:visited {text-decoration:none;color:#ffcc33; A:active {text-decoration:none;color:#ffffff; A:hover {text-decoration:underline;color:#ffff00;font-weight:bold // --> </STYLE> </head>
5 Sección 1: Hojas de Estilo Dando estilo a varias páginas Guardar este contenido en un fichero nombre.css P { font-size : 12pt; font-family : arial,helvetica; % font-weight:normal; H1 { font-size : 36pt; font-family : verdana,arial;% text-decoration : underline; text-align : center;% background-color: Teal; TD { font-size : 10pt; font-family : verdana,arial; text-align : center; background-color : ; BODY { background-color : #006600; font-family : arial; color : White; incluir en la cabecera de un documento nuevo la etiqueta <link rel=stylesheet type= text/css href= estilomio.css >
6 Sección 1: Hojas de Estilo 6 Nombre del Posibles valores Ejemplos atributo FUENTES - FONT color valor RGB color: # color: red; font-size xx-small x-small small medium large x-large xx-large Unidades de CSS font-size:12pt; font-size: x- large; font-family serif sans-serif cursive fantasy monospace Todas las fuentes habituales font-weight normal-bold -bolde -lighter fontfamily:arial,helvetica; font-size: fantasy; font-weight:bold;fontweight: 200; font-style normal italic oblique font-style:normal; fontstyle: italic;
7 Sección 1: Hojas de Estilo 7 Nombre del Posibles valores Ejemplos atributo PÁRRAFOS - TEXT line-height normal y unidades CSS line-height: 12px; lineheight: normal; textdecoratiothrough none ;underline; overline ; line- text-decoration: none; text-decoration: under- line; text-align left right center justify text-align: right; textalign: center; text-indent Unidades CSS text-indent: 10px;textindent: 2in; texttransform capitalize uppercase lowercase none text-transform: none;
8 Sección 1: Hojas de Estilo 8 Nombre del Posibles valores Ejemplos atributo BOX - CAJA Margin-left Unidades CSS margin-left: 1cm; margin-left: 0,5in; Margin-right Unidades CSS margin-right: 5margin-right: 1in; Margin-top Unidades CSS margin-top: 0px; margin-top: 10px; Margin-bottom Unidades CSS margin-bottom: 0pt; margin-top: 1px; Padding-left Unidades CSS Padding-right Padding-top Padding-bottom Border-color border-width Unidades CSS Unidades CSS Unidades CSS Codigo RGB Unidades CSS
9 Sección 2: JavaScript 9 2. JavaScript 2.1. Introdución Netscape, después de hacer sus navegadores compatibles con los applets, comenzó a desarrollar un lenguaje de programación al que llamó LiveScript que permitiese crear pequeños programas en las páginas y que fuese mucho más sencillo de utilizar que Java. De modo que el primer Javascript se llamo LiveScript, pero no duró mucho ese nombre, pues antes de lanzar la primera versión del producto se forjó una alianza con Sun Microsystems, creador de Java, para desarrollar en conjunto ese nuevo lenguaje. La alianza hizo que Javascript se diseñara como un hermano pequeño de Java, solamente útil dentro de las páginas web y mucho más fácil de utilizar, de modo que cualquier persona, sin conocimientos de programación pudiese adentrase en el lenguaje y utilizarlo a sus anchas. Además, para programar Javascript no es necesario un kit de desarrollo, ni compilar los scripts, ni realizarlos en ficheros externos al código HTML, como ocurría con los applets.
10 Sección 2: JavaScript Diferencias entre Java y Javascript Queremos que quede claro que Javascript no tiene nada que ver con Java, salvo en sus orígenes, como se ha podido leer hace unas líneas. Actualmente son productos totalmente distintos y no guardan entre si más relación que la sintaxis idéntica y poco más. Algunas diferencias entre estos dos lenguajes son las siguientes: Compilador. Para programar en Java necesitamos un Kit de desarrollo y un compilador. Sin embargo, Javascript no es un lenguaje que necesite que sus programas se compilen, sino que éstos se interpretan por parte del navegador cuando éste lee la página. Orientado a objetos. Java es un lenguaje de programación orientado a objetos. (Más tarde veremos que quiere decir orientado a objetos, para el que no lo sepa todavía) Javascript no es orientado a objetos, esto quiere decir que podremos programar sin necesidad de crear clases, tal como se realiza en los lenguajes de programación estructurada como C o Pascal. Propósito. Java es mucho más potente que Javascript, esto es debido a que Java es un lenguaje de propósito general, con el que se pueden hacer aplicaciones de lo más variado, sin embargo, con Javascript sólo podemos escribir programas para que se ejecuten en páginas web.
11 Sección 3: Variables y Funciones Variables y Funciones 1. Números.Para empezar tenemos el tipo numérico, para guardar números como 9 o 23.6 var num1 = 23 var num2 = 33 var rio = new Array(); rio[0]="rios"; rio[1]="adaja";rio[2]="alagon";rio[3]="alberche";rio[4]="almanzora"; 2. Cadenas. El tipo cadena de carácter guarda un texto. Siempre que escribamos una cadena de caracteres debemos utilizar las comillas ( ). var nombre = "Javier" var tema = "Java" 3. Boleanos.También contamos con el tipo boleano, que guarda una información que puede valer si (true) o no (false). function nombre (parametros) { Sentencias...
12 Sección 3: Variables y Funciones 12 Ejemplo Manejo de variables y funciones con formularios <html> <head> <title>var1</title> <!-- START OF SCRIPT --> <SCRIPT LANGUAGE="JAVASCRIPT"> function cuadrado(numero) { return numero * numero; </SCRIPT> <!-- END OF SCRIPT --> </head> <body bgcolor="#990000"> % <form >% <input name="entra" type="text" value="0">% <input name="sale" type="text" value="">% <input type="button" value="x^2" onclick="sale.value=cuadrado(entra.value)"> % </form> </body> Diseñar una calculadora conversora de euros
13 Sección 3: Variables y Funciones 13 Ejemplo Escribiendo resultados de variables y funciones con alert() <SCRIPT LANGUAGE="JAVASCRIPT"> var resul=0; function square(number) { resul= number * number; </SCRIPT> <!-- FIN SCRIPT --> </head> <body bgcolor="#990000"> <form> <input name="entra" type="float" value="2"> <input type="button" value="x^2" onclick="eval(square(this.form.entra.value)); alert(resul)"> </form> </body>
14 Sección 3: Variables y Funciones 14 Ejemplo Escribiendo resultados de variables en formularios <SCRIPT> function Mostrar(formul){ var sel=formul.losrios.selectedindex; var name=formul.losrios.options[sel].text; formul.indice.value=sel; formul.nombre.value=name; </SCRIPT> </head> <body bgcolor="#ccffff"> <FORM> Numero de la Lista <br> <input name="indice" type="text" value=""> <br> Nombre de Rio <br> <input name="nombre" type="text" value=""> <br> <select name="losrios" size=23 style="background-color:#ffff99" onchange="mostrar(this.form);"> <option selected>rios <option> Adaja <option> Alagón <option> Alberche <option> Almanzora <option> Andarax <option> Aragón <option> Bidasoa <option> Besaya <option> Cinca <option> Deva <option> Duero <option> Ebro <option> Eo <option> Eresma <option> Esla <option> Eume <option> Gallego <option> Genil <option> Guadalimar <option> Guadalorce <option> Guadiana <option> Guadiana manor <option> Guadiato <option>gualdalquivir
15 Sección 3: Variables y Funciones 15 </select> </FORM>
16 Sección 3: Variables y Funciones 16 Ejemplo Escribiendo resultados de variables y funciones en el document <html> <head> <title>strings_1</title> <!-- INICIO SCRIPT --> <SCRIPT LANGUAGE="JAVASCRIPT"> num = [1,2,3,4,5,6,7,8,9 ]; var NumerodeTabla; NumerodeTabla=prompt("Quieres la tabla de SUMAR del número?","0"); document.write("<strong> <H1>TABLA de SUMAR del\t"+ NumerodeTabla+"</H1></strong> <hr>"); document.write(numerodetabla+"+\t"+num[0]+"\t = \t"+ eval(eval(numerodetabla)+num[0])+"<br>"); document.write(numerodetabla+"+\t"+num[1]+"\t = \t"+ eval(eval(numerodetabla)+num[1])+"<br>"); document.write(numerodetabla+"+\t"+num[2]+"\t = \t"+ eval(eval(numerodetabla)+num[2])+"<br>"); document.write(numerodetabla+"+\t"+num[3]+"\t = \t"+ eval(eval(numerodetabla)+num[3])+"<br>"); </SCRIPT> </head> <body>
17 Sección 3: Variables y Funciones 17 </body> </html>
18 Sección 3: Variables y Funciones Variables Globales y Locales Ejemplo Controlando el ámbito de las Variables <html> <head> <title>var3</title> <SCRIPT LANGUAGE="JAVASCRIPT"> var variable="soy GLOBAL"; function VarGlobal() { alert(variable); function VarLocal() { variable="soy LOCAL"; alert(variable); </SCRIPT> </head> <body> <input type="button" value="muestra Global" onclick="varglobal()"> <input type="button" value="muestra Local" onclick="varlocal()"> </body> </html>
19 Sección 3: Variables y Funciones Operadores Aritméticos y Lógicos Ejemplo Operadores aritméticos <html> <head> <title>var3</title> </head> <body> Numero <form> <input type="text" name="entra" value=1> <br> <input type="button" value="x+=2" onclick="entra.value+=2"> <input type="button" value="x -= 1" onclick="entra.value-=1"> <input type="button" value="x *= 2" onclick="entra.value*=2"> <input type="button" value="x /= 3" onclick="entra.value/=3"> <input type="button" value="x mod 5" onclick="entra.value%= 5"> <input type="button" value="inicio" onclick="entra.value=1"> </form> </body> </html> x+ = y x = x + y x = y x = x y x = y x = x y x/ = y x = x/y == igualdad! = desigualdad > mayor < menor
20 Sección 4: Condición If...Else Condición If...Else if (condition) { Sentencias... else { Sentencias... <html> <head> <title>ifelse</title> <!-- INICIO SCRIPT --> <SCRIPT LANGUAGE="JAVASCRIPT"> function Nota(a,b) { var media=(parseint(a)+parseint(b))/2; var final=""; if (media<5) {final="suspenso"; else { final="aprobado"; document.notas.calificar.value=final; return final; </SCRIPT> </head> <body> <form name="notas"> "HTML" <input type="text" name="html" value=""><br> "JavaScript "<input type="text" name="js" value=""> <br> <input type="button" name="java" value="calificación" onclick="nota(html.value,js.value)"> <input type="text" name="calificar"> </form>
21 Sección 4: Condición If...Else 21 </body> </html>
22 Sección 5: Bucle For Bucle For for (var i=inicio; i < final; i++) { sentencias; <html> <head> <title>for_2</title> <SCRIPT> function TablaSumar(num) { for (var i=1; i < 11; i++) { document.writeln(i+"+\t"+num+"\t =\t "+eval(i+eval(num))+"<br>"); num=prompt("quieres la tabla de SUMAR del número?","0"); TablaSumar(num); </SCRIPT> </head> <body> </body> </html>
23 Sección 6: Bucle switch Bucle switch switch (expresion ) { case valor1: sentencias; break; case valor2: sentencias; break; default: sentencias; Ejercicio: Generar de forma aleatoria una quiniela de 15 resultados con 1, X 2. <SCRIPT LANGUAGE="JAVASCRIPT"> var rellenar="";var resultado=""; for (var i=1; i < 16; i++) { casilla=math.floor(3*math.random())+1; switch (casilla) { case 1: rellenar="1"; break; case 2: rellenar="x"; break; case 3: rellenar="2"; break; default: resultado=resultado+"casilla \t\t\t"+i+ +"=\t"+rellenar+"<br>" document.write(resultado); </SCRIPT> </head> 2
24 Sección 7: Objetos en javascript Objetos en javascript String, para el trabajo con cadenas de caracteres. Date, para el trabajo con fechas. Math, para realizar funciones matemáticas. Number, para realizar algunas cosas con números Boolean, trabajo con boleanos.
25 Sección 7: Objetos en javascript Clase String Metodos de los string Length charat(indice) indexof(carácter,desde) lastindexof(carácter,desde) substring(inicio,fin) tolowercase() touppercase() número de caracteres del String. Devuelve el carácter que hay en la posición indicada como índice. Devuelve la posición de la primera vez que aparece el carácter indicado por parámetro en un string. El segundo parámetro es opcional y sirve para indicar a partir de que posición empieza la búsqueda. igual que la función indexof pero desde el final en lugar del principio. Devuelve el substring que empieza en el carácter de inicio y termina en el carácter de fin. Pone todas los caracteres de un string en minúsculas. Pone todas los caracteres de un string en mayúsculas.
26 Sección 7: Objetos en javascript 26 Ejemplo Escribiendo resultados de variables y funciones en el document <html> <head> <title>for_2</title> <SCRIPT LANGUAGE="JAVASCRIPT"> var mistring = "Hola ALUMNOS" var result = "" for (i=0;i<mistring.length-1;i++) { result += mistring.charat(i) result += "-" result += mistring.charat(mistring.length - 1) document.write("<h2>"+result+"</h2>") </SCRIPT> </head> <body > </body> </html>
27 Sección 7: Objetos en javascript Clase Date Sobre este objeto recae todo el trabajo con fechas en Javascript, como obtener una fecha, el día la hora y otras cosas. Para trabajar con fechas necesitamos instanciar un objeto de la clase Date y con él ya podemos realizar las operaciones que necesitemos. Un objeto de la clase Date se puede crear de dos maneras distintas. Por un lado podemos crear el objeto con el día y hora actuales y por otro podemos crearlo con un día y hora distintos a los actuales. Esto depende de los parámetros que pasemos al construir los objetos. Para crear un objeto fecha con el día y hora actuales colocamos los paréntesis vacíos al llamar al constructor de la clase Date. mifecha = new Date() Para crear un objeto fecha con un día y hora distintos de los actuales tenemos que indicar entre paréntesis el momento con que inicializar el objeto. Hay varias maneras de expresar un día y hora válidas, por eso podemos construir una fecha guiándonos por varios esquemas. Estos son dos de ellos, suficientes para crear todo tipo de fechas y horas. mifecha = new Date(año,mes,dia,hora,minutos,segundos) mifecha = new Date(año,mes,dia) Los valores que debe recibir el constructor son siempre numéricos. Un detalle, el mes comienza por 0, es decir, enero es el mes 0. Si no indicamos la hora, el objeto fecha se crea con hora 00:00:00.
28 Sección 7: Objetos en javascript 28 Metodos de Date getdate() Devuelve el día del mes. getday() Devuelve el día de la semana gethours() Retorna la hora. getminutes() Devuelve los minutos. getmonth() Devuelve el mes (atención al mes que empieza por 0). getseconds() vuelve los segundos. setdate() Actualiza el día del mes. sethours() Actualiza la hora. setminutes() Cambia los minutos. setmonth() Cambia el mes (atención al mes que empieza por 0)
29 Sección 7: Objetos en javascript 29 Ejemplo Mostrando la hora <title>reloj</title> <link rel="stylesheet" href="../estilo.css" type="text/css"> <SCRIPT LANGUAGE="JAVASCRIPT"> <!-- function JSClock() {--> var time = new Date() var hour = time.gethours() var minute = time.getminutes() var second = time.getseconds() var temp = "" + ((hour > 12)? hour - 12 : hour) temp += ((minute < 10)? ":0" : ":") + minute temp += ((second < 10)? ":0" : ":") + second temp += (hour >= 12)? " P.M." : " A.M." document.write( temp) <!-- </SCRIPT> </head> <body > </body>
30 Sección 8: Eventos en Javascript Eventos en Javascript Un evento, como su mismo nombre indica, es algo que ocurre. Para que una rutina nuestra se ejecute sólo cuando suceda algo extraño deberemos llamarla desde un controlador de eventos. Estos controladores se asocian a un elemento HTML y se incluyen así: <A HREF= o nmouseover= MiFuncion() En los manejadores de eventos se tiene que especificar la jerarquía entera de objetos del navegador, empezando siempre por el objeto window. Evento Descripción Elementos que lo admiten onload Terminar de cargarse una página <BODY...> <FRAMESET...> % onunload Salir de una página (descargarla) <BODY...><FRAMESET...> onmouseover Pasar el ratón por encima <A HREF..> <AREA...> onmousedown cuando el usuario pulsa el botón onmouseout Que el ratón deje de estar encima <A HREF..> <AREA...> % onsubmit Enviar un formulario <FORM...> onclick Pulsar un elemento <INPUT TYPE="button, % checkbox, link, radio"...> onblur Perder el cursor <INPUT TYPE="text"...> <TEXTAREA...> onchange Cambiar de contenido o perder el cursor <INPUT TYPE="text"...> onfocus Conseguir el cursor <INPUT TYPE="text"...>
31 Sección 8: Eventos en Javascript 31 onselect Seleccionar texto <INPUT TYPE="text"...>
32 Sección 8: Eventos en Javascript 32 Capturar las coordenadas en el document <script > ie = (document.all)? 1:0 n6 = (document.getelementbyid)? 1:0 var ie5 = (document.getelementbyid && document.all); var ns6 = (document.getelementbyid &&!document.all); function RatonXY(e){ Xpos= (ie5)?event.x:(ns6)?clientx=e.clientx:false; Ypos= (ie5)?event.y:(ns6)?clienty=e.clienty:false; document.coor.x.value=xpos; document.coor.y.value=ypos; document.onmousemove= RatonXY; </script> </head> <body> <form name="coor"> Coordeanada X <input name="x" size=5 type="text" value=""> Coordeanada Y <input name="y" size=5 type="text" value=""> </form> </body>
33 Sección 8: Eventos en Javascript 33 Uso del evento para diseñar un MAP de imagenes Añadimos al script anterior las dos funciones siguientes: function trackmouse(e){ Xpos= (ie5)?event.x:(ns6)?clientx=e.clientx:false; Ypos= (ie5)?event.y:(ns6)?clienty=e.clienty:false; if (Ypos>0) {x = x+, + eval(xpos-20) +, + eval(ypos-60); return x; function Poner(form){ form.coor.value = x; document.onclick= trackmouse; </script> <body> <FORM> <input type="button" value="a~nadir" onclick="poner(this.form)"> Marca la region a limitar <input name="coor" size=40 type="text" value=""> </FORM> Utilizar el script completo anterior para mapear la imagen siguiente
34 Sección 9: Capas en HTML Capas en HTML Una capa es una división, una parte de la página, que tiene un comportamiento muy independiente dentro de la ventana del navegador, ya que la podemos colocar en cualquier parte de la misma y la podremos mover por ella independientemente, por poner dos ejemplos. En el uso de capas se basan muchos de los efectos más comunes del DHTML.. Las etiquetas <LAYER> e <ILAYER> tienen como objetivo construir capas, pero estas no son compatibles más que con Netscape, por lo que es recomendable utilizar la etiqueta <DIV> para hacer capas preferentemente a las otras dos.
35 Sección 9: Capas en HTML 35 Control de CAPAS / DIV Obtener una referencia al objeto DIV var capa=document.getelementbyid( idcapa ); [IE>5 / NS>6] Hacer visible/invisible una CAPA [IE>5 / NS>6] var capa=document.getelementbyid( idcapa ); var capa=document.getelementbyid( idcapa ); capa.style.visibility=visible ; // La hace visible capa.style.visibility=hidden ; // La hace invisible Cambiar dinámicamente el contenido HTML de una CAPA [IE>5 / NS>6] var capa=document.getelementbyid( idcapa ); capa.innerhtml=hola ; Modificar la posición del scroll de una CAPA [IE>5 / NS>6] var capa=document.getelementbyid( idcapa ); capa.scrolltop=0;
36 Sección 9: Capas en HTML 36 Atributos de las Capas position Puede tener dos valores, relative o absolute. top distancia en vertical donde se colocará la capa left indica la distancia en horizontal. height el tamaño de la capa en vertical, es decir, su altura width ndica la anchura de la capa. visibility si la capa se puede ver en la página o permanece oculta al usuario. z-index posición sobre el eje z que tendrán las distintas capas de la página. clip sirve para recortar determinadas áreas de la capa rect (<top>, <right>, <bottom>, <left>)
37 Sección 9: Capas en HTML 37 Diseño de capas <STYLE TYPE="text/css"> #capa1 {position:relative; top:50px; left:15px; background-color:#ffff99; border-width:1; border-color:#cc00ee; width:200px;z-index=5; </STYLE> </head> <body> <DIV ID=capa1> <H1>CAPA 1</H1> <P>Esto es una capa</p> <P>El contenido puede ser texto</p> <P>Graficos o incluso otra pagina web</p> </DIV>
38 Sección 9: Capas en HTML 38 Capas con Texto <SCRIPT LANGUAGE="JavaScript"> n = (document.layers)? 1:0 ie = (document.all)? 1:0 n6 = (document.getelementbyid)? 1:0 </SCRIPT> <link rel="stylesheet" href="estilomio.css" type="text/css"> <STYLE TYPE="text/css"> #layer1 {position:absolute; top:120px; left:205px; background-color:#ffff99; border-width:1; border-color:#cc00ee; width:200px;z-index=1; </STYLE> </head> <body> <h2> Algunas capas diferentes</h2> <br> <DIV ID=layer1> <H1>Capa 1</H1> <P>Esto es una capa</p> <P>Encima de otra</p> <P> </P> </DIV>
39 Sección 9: Capas en HTML 39 <DIV STYLE="position:absolute; top:100px; left:25px; background-color:#ffcc00; border-width:20px; border-style:ridge; border-color:#990000; padding:5% width:200;"> <H2>Capa 1</H2> <P>Esto es otra capa</p> <P >por debajo de la capa 2.</P> </DIV> </body>
40 Sección 9: Capas en HTML 40 Capas con Imagen-Ocultar y Mostrar <SCRIPT LANGUAGE="JavaScript"> ie = (document.all)? 1:0; n6 = (document.getelementbyid)? 1:0 function Mostrar() { if (n6) document.getelementbyid( uno ).style.visibility = if (ie) uno.style.visibility = "visible" "visible" function Ocultar() { if (n6) document.getelementbyid( uno ).style.visibility = "hidden" if (ie) uno.style.visibility = "hidden" </SCRIPT>
41 Sección 9: Capas en HTML 41 <SCRIPT LANGUAGE="JavaScript"><!-- n = (document.layers)? 1:0 ie = (document.all)? 1:0 n6 = (document.getelementbyid)? 1:0 Capas con un documento function carga(page) { if (n) document.textframe.src = page if (ie) textframe.document.location = page if (n6) document.getelementbyid( textframe ).src=page function show() { if (n) document.textn.visibility = "show" if (n6) document.getelementbyid( uno ).style.visibility = if (ie) uno.style.visibility = "visible" function hide() { if (n) document.uno.visibility = "hide" if (n6) document.getelementbyid( uno ).style.visibility = "hidden" if (ie) uno.style.visibility = "hidden" //--> "visible"
42 Sección 9: Capas en HTML 42 </SCRIPT> <link rel="stylesheet" href="estilomio.css" type="text/css"> <STYLE TYPE="text/css"> #uno {position:absolute; top:80px; left:155px;background-color:#ffffff; border-width:0; border-color:#990000; width:200px;height:100px; </STYLE> </head> <BODY onload=hide()> <A HREF="javascript:show()"><H2>muestra la pagina 1 </H2></A><br> <DIV ID="uno"> <A HREF="javascript:hide()"> <IFRAME SRC="capa1.html" ID="textframe" SCROLLING="yes" WIDTH="400" HEIGHT="200" MARGINWIDTH=0 MARGINHEIGHT=0 FRAMEBORDER="No" onclick=hide()> </A> </DIV>
43 Sección 9: Capas en HTML 43 <SCRIPT LANGUAGE="JavaScript"> Capas con Movimiento var sufijo; objectleftpos = 0; objecttoppos = 0; n = (document.layers)? 1:0 ie = (document.all)? 1:0 n6 = (document.getelementbyid)? 1:0 function moveright() { if (document.all) {object = layer1.style if (document.layers) {object = document.layer1 else if (document.getelementbyid) { object = document.getelementbyid( layer1 ).style if (objectleftpos < 650) { objectleftpos += 10; object.left = objectleftpos; settimeout("moveright()",10) </SCRIPT>
44 Sección 9: Capas en HTML 44 <STYLE TYPE="text/css"> #layer1 {position:relative; top:50px; left:15px; background-color:#ffff99; border-width:1; border-color:#cc00ee; width:200px;z-index=0; </STYLE> </head> <body> Para mover una CAPA <br> <input type="button" value="pulsa" onclick="moveright()"> <DIV ID=layer1 > <img src="imalit/corredor.gif" width="114" height="134" alt="" border="0"> </DIV>
CSS. Departamento de Lenguajes y Computación Universidad de Almería CSS. Contenidos
Desarrollo de aplicaciones web Manuel Torres Gil mtorres@ual.es Departamento de Lenguajes y Computación Universidad de Almería Desarrollo de aplicaciones web 1. Características y ventajas de 2. Sintaxis
Más detallesYusef Hassan Montero Francisco Jesús Martín Fernández. Introducción a DOM. Todos los derechos reservados www.nosolousabilidad.com
Yusef Hassan Montero Francisco Jesús Martín Fernández Introducción a DOM Todos los derechos reservados www.nosolousabilidad.com INTRODUCCIÓN DOM, Document Object Model o Modelo de Objetos de Documento,
Más detallesDREAMWEAVER 2 UNIVERSIDAD TECNOLOGICA DE AGUASCALIENTES
DREAMWEAVER 2 UNIVERSIDAD TECNOLOGICA DE AGUASCALIENTES Presentación José Alberto Rodríguez Castañeda Universidad Tecnológica de Aguascalientes http://ww.betiux.com.mx betordz@gmail.com Temas. 1) Javascript
Más detallesYusef Hassan Montero Francisco Jesús Martín Fernández. Referencia CSS. Todos los derechos reservados www.nosolousabilidad.com
Yusef Hassan Montero Francisco Jesús Martín Fernández Referencia CSS Todos los derechos reservados www.nosolousabilidad.com Introducción Este documento tiene por objetivo servir de material de apoyo y
Más detallesJavaScript Básico. Ejemplo. Arreglos en JavaScript Creación de Arreglos. Asignación de valores. var miarray = new Array() var miarray = new Array(10)
1 JavaScript (III) JavaScript Básico Arreglos en JavaScript Creación de Arreglos var miarray = new Array() var miarray = new Array(10) Asignación de valores. miarray[0] = 1 miarray[1] = 0.5 miarray[2]
Más detallesHTML. HTML (HyperText Markup Language) Creado en 1989 por el físico nuclear TIM BERNERS- LEE
HTML HTML (HyperText Markup Language) Creado en 1989 por el físico nuclear TIM BERNERS- LEE Se elaboró un protocolo para soportar e envío de información por la red. HTTP (Hyper Text Transfer Protocol)
Más detallesCreación y uso de Hojas de Estilo
Creación y uso de Hojas de Estilo Definición de Hojas de Estilo con la etiqueta Definición de Hojas de Estilo en Ficheros Externos Definición de Clases de Estilo Definición de Estilos Individuales
Más detallesCSS, hojas de estilos
CSS, hojas de estilos 1. Introducción a las CSS El lenguaje HTML está limitado a la hora de aplicarle forma a un documento. Esto es así porque fue concebido para otros usos (científicos sobre todo), distinto
Más detallesCAPAS O CONTENEDORES EN HTML. ETIQUETAS DIV Y SPAN. EJEMPLOS. MAQUETAR O DAR ESTRUCTURA A LAS PÁGINAS WEB. (CU00726B)
APRENDERAPROGRAMAR.COM CAPAS O CONTENEDORES EN HTML. ETIQUETAS DIV Y SPAN. EJEMPLOS. MAQUETAR O DAR ESTRUCTURA A LAS PÁGINAS WEB. (CU00726B) Sección: Cursos Categoría: Tutorial básico del programador web:
Más detallesCapítulo 3 Estilo para un documento HTML: CSS
Capítulo 3 Estilo para un documento HTML: CSS.3.0 Qué es el estilo?!"#$ "!$ &'!$!($ ) *+ " *, -.,#/-..3.1 Propiedades y valores 0 )" & + 1& &1& 2 " '" Medidas: 3 + 14 "56 1'#/ 1/5-7 3 1 1 + 1' Colores:
Más detalles1.1.- Introducción a la Web Vemos una introducción al medio donde se encajan los lenguajes que vamos a tratar: la web.
Sesión 01: Introducción a los lenguajes web COMPUTACION E INFORMATICA WEB DEVELOPPER III Competencias a Conseguir: - Introducción general a la programación web. - Conocer y diferenciar el concepto de páginas
Más detallesCreación del sitio web del Laboratorio F1
Creación del sitio web del Laboratorio F1 Jonatan Grandmontagne García Universidad de León, España jon@usuarios.retecal.es Este documento muestra como se ha diseñado el sitio web donde se expone el proyecto
Más detallesXAJAX: una librería de AJAX para PHP (parte 1)
XAJAX: una librería de AJAX para PHP (parte 1) AJAX es el acrónimo de Asynchronous Javascript And XML o Javascript y XML asíncronos dicho en nuestro idioma. Se trata de una combinación de tecnologías que
Más detallesPHP: Interacción con HTML
Francisco J. Martín Mateos Carmen Graciani Diaz Dpto. Ciencias de la Computación e Inteligencia Artificial Universidad de Sevilla Variables En algunas ocasiones es necesario saber si una variable tiene
Más detallesAPLICACIONES PARA INTERNET
CUN APLICACIONES PARA INTERNET GUIA 1 Juan Carlos Saavedra Serrato 2014 1. Consulte Cuantos tipos de Lenguajes de programación web existen y reseñe una característica de cada uno de ellos. Los diferentes
Más detallesCreación de una página web accesible sencilla
Unidad 2: Las hojas de estilo en cascada Creación de una página web accesible sencilla Objetivos: -Agregar formato a la página creada, a través de una hoja de estilo. Contenidos: -Incorporación de una
Más detallesCSS. Cascading Style Sheets (Hojas de estilo en cascada)
1 CSS Cascading Style Sheets (Hojas de estilo en cascada) INTRODUCCIÓN Las Hojas de estilo son un conjunto de reglas de estilo definidas por el programador sobre elementos HTML, que definen la apariencia
Más detallesPaquete de trabajo 3. Diseño Web del Proyecto REMERI. Manual. Enero 2013
Paquete de trabajo 3 Diseño Web del Proyecto REMERI Manual Enero 2013 Red Mexicana de Repositorios Institucionales REMERI 2 HOJA EN BLANCO Red Mexicana de Repositorios Institucionales REMERI 3 Paquete
Más detalles1. Utilizar JavaScript en un documento HTML 3. 2. Tipos de datos y expresiones en JavaScript 9 2.1. Variables... 9 2.2. Expresiones y operadores...
Índice general 1. Utilizar JavaScript en un documento HTML 3 2. Tipos de datos y expresiones en JavaScript 9 2.1. Variables.................................. 9 2.2. Expresiones y operadores.........................
Más detallesEJERCICIOS HTML BÁSICOS
EJERCICIOS HTML BÁSICOS Ejercicio 1 Crear un documento HTML desde cero Crea la estructura de carpetas del sitio (carpeta raíz, carpeta de imágenes y de scripts). Dentro de la carpeta de scripts crea un
Más detallesArquitectura de Tecnologías Web Por César Bustamante Gutiérrez. Módulo II: Tecnologias del lado del Cliente Tema 1: HTML5. www.librosdigitales.
1 Que es CSS3? El CSS sirve para definir la estética de un sitio web en un documento externo y eso mismo permite que modificando ese documento (la hoja CSS) podamos cambiar la estética entera de un sitio
Más detallesRECUPERAR DATOS DE UN FORMULARIO HTML USANDO PHP. USO DE $_GET. EJEMPLOS Y EJERCICIOS RESUELTOS. (CU00833B)
APRENDERAPROGRAMAR.COM RECUPERAR DATOS DE UN FORMULARIO HTML USANDO PHP. USO DE $_GET. EJEMPLOS Y EJERCICIOS RESUELTOS. (CU00833B) Sección: Cursos Categoría: Tutorial básico del programador web: PHP desde
Más detallesFormularios HTML. Elementos de Programación y Lógica
Formularios HTML Elementos de Programación y Lógica Formularios HTML es un lenguaje de marcado cuyo propósito principal consiste en estructurar los contenidos de los documentos y páginas web. Sin embargo,
Más detallesClases y objetos en JavaScript
Clases y objetos en JavaScript Sergio Luján Mora Departamento de Lenguajes y Sistemas Informáticos JavaScript Nombre original: Mocha LiveScript (1995) Netscape 2.0B3 (diciembre 1995) Lenguaje más estándar
Más detallesCSS, hojas de estilos
CSS, hojas de estilos Introducción a las CSS El lenguaje HTML está limitado a la hora de aplicarle forma a un documento. Esto es así porque fué concebido para otros usos (científicos sobretodo), distinto
Más detallesDesarrollo de Aplicaciones para Internet I. Unidad III - CSS Profesor: M.C. Martín Olguín
Desarrollo de Aplicaciones para Internet I Unidad III - CSS Profesor: M.C. Martín Olguín Cascading Style Sheets (CSS) Aunque el HTML desde sus orígenes privilegia el contenido sobre la apariencia, esta
Más detallesEjemplo: font-size: 10pt; text-decoration: underline; color: black; (el último punto y coma de la lista de atributos es opcional)
Anexo: Reglas básicas sobre la sintaxis CSS: Para definir un estilo se utilizan atributos como font-size,text-decoration... seguidos de dos puntos y el valor que le deseemos asignar. Podemos definir un
Más detallesANEXO. Documento de pautas de comunicación y diseño para el desarrollo de trámites en linea.
ANEXO. Documento de pautas de comunicación y diseño para el desarrollo de trámites en linea. Ministerio de Gobierno y Reforma del Estado Secretaría de Tecnologías para la Gestión Secretaría de Comunicación
Más detallesEJEMPLO DE APERTURA Y CIERRE DE UNA ETIQUETA.
DOCUMENTOS HTML QUÉ SON? Los documentos HTML son archivos creados con etiquetas en lenguaje de hyper text markup language (lenguaje de hipertexto). Estos documentos son interpretados por los programas
Más detallesJavaScript toma su sintaxis de los lenguajes de programación más conocidos, fundamentalmente C/C++, aunque también algo de Pascal.
1 JavaScript 1.1 Qué es JavaScript? JavaScript es un lenguaje interpretado. Es idóneo para trabajar en Web, ya que son los navegadores que utilizamos los que interpretan (y por tanto ejecutan) los programas
Más detallesTutorial Servicios Web
Tutorial Servicios Web 1. Servicios Web con REST Como ya hemos usado SOAP para WebService, podemos afirmar que es bien fácil de diseñar, pero algo complicado de consumir: se necesita toda una API para
Más detallesHTML dinámico: Javascript
Javascript Departamento de Lenguajes escuela técnica superior de ingeniería informática Grupo de Ingeniería a del Software Noviembre 2006 Versión original: Amador Durán y David Benavides (octubre 2005)
Más detallesUNIVERSIDAD DE EL SALVADOR FACULTAD MULTIDISCIPLINARIA DE OCCIDENTE TEMA: XHTML CATEDRA: INTRODUCCION A LA PROGRAMACION EN INTERNET
UNIVERSIDAD DE EL SALVADOR FACULTAD MULTIDISCIPLINARIA DE OCCIDENTE TEMA: XHTML CATEDRA: INTRODUCCION A LA PROGRAMACION EN INTERNET DOCENTE: Ing. CARLOS ARTURO RUANO. INSTRUCTOR: Tec. DANIEL EDENILSON
Más detallesTEMA 9 CREACIÓN DE PÁGINAS WEB
TEMA 9 CREACIÓN DE PÁGINAS WEB OBJETIVOS Conocer las páginas web y sus elementos. Insertar tablas, capas, enlaces en las páginas web. Crear páginas web con NVU. Crear un sitio web. Configurar un sitio
Más detallesEVENTOS (II) : MODELO BÁSICO DE EVENTOS
EVENTOS (II) : MODELO BÁSICO DE EVENTOS TIPOS DE EVENTOS JavaScript es un lenguaje "orientado a eventos", esto quiere decir que está preparado para responder a acciones del navegante, cosas que ocurran
Más detallesCursito 28: Curso de HTML Parte 4
Por Roxana Bassi rox@roxanabassi.com.ar / http://www.roxanabassi.com.ar Publicado en la sección los cuadernos de Internet World en la revista Internet World Latinoamérica en el período 1995-1999 Cursito
Más detallesÍndice. Introducción. Página 2 Empecemos con un ejemplo. Página 3 Crea tu site: Página 3
Índice. Introducción. Página 2 Empecemos con un ejemplo. Página 3 Crea tu site: Página 3 Anexo. Guía para desarrollo de programas en HTML y JavaScript. 1. Introducción. En este anexo vamos a escribir un
Más detallesCLASS JAVASCRIPT CLASES? OBJETOS PREDEFINIDOS. WINDOW, OBJETO GLOBAL. NUMBER, MATH, DATE, REGEXP, ERROR. (CU01144E)
APRENDERAPROGRAMAR.COM CLASS JAVASCRIPT CLASES? OBJETOS PREDEFINIDOS. WINDOW, OBJETO GLOBAL. NUMBER, MATH, DATE, REGEXP, ERROR. (CU01144E) Sección: Cursos Categoría: Tutorial básico del programador web:
Más detalles1 BARRA de NAVEGACIÓN VERTICAL con BOTONES rollovers
Barra de navegación vertical con Botones rollovers_tic 1º Bachillerato página 1/8 1 BARRA de NAVEGACIÓN VERTICAL con BOTONES rollovers...1 1.1 Intro...1 1.2 Código HTML de la lista de vínculos...2 1.3
Más detallesHTML El idioma de Internet (Parte 1)
HTML El idioma de Internet (Parte 1) El lenguaje HTML Lenguaje de marcas de hipertexto Sintaxis extremadamente sencilla Documentos en archivos de texto simples Texto sin formato Diferenciación de los distintos
Más detallesImágenes y objetos IMÁGENES
IMÁGENES Y OBJETOS Imágenes y objetos 2 IMÁGENES Uno de los elementos más vistosos e importantes de las páginas web. Su introducción puede explicar de manera más fácil y agradable nuestra información al
Más detallesPáginas web ::: Hojas de estilo CSS Diseño de materiales multimedia. Web 2.0. 1.7 Hojas de estilo CSS
49 1.7 Hojas de estilo CSS 50 1.7 Hojas de estilo CSS 1.7.1 Qué es una hoja de estilo? Una hoja de estilo es un archivo de extensión *.CSS (CSS, Cascading Style Sheets = Hojas de estilo) que contempla
Más detalles7. Definición de un estilo en función del contexto.
7. Definición de un estilo en función del contexto. Este otro recurso que provee las CSS es la definición de un estilo para una marca HTML siempre y cuando la misma esté contenida por otra marca determinada.
Más detallesGENERAR DOCUMENTOS HTML USANDO LENGUAJE PHP. EJERCICIO RESUELTO EJEMPLO SENCILLO. (CU00733B)
APRENDERAPROGRAMAR.COM GENERAR DOCUMENTOS HTML USANDO LENGUAJE PHP. EJERCICIO RESUELTO EJEMPLO SENCILLO. (CU00733B) Sección: Cursos Categoría: Tutorial básico del programador web: HTML desde cero Fecha
Más detallesDesarrollo Web en Entorno Servidor
Desarrollo Web en Entorno Servidor Tema 1: Introducción 1. Tipos de páginas Web. 2. Instalación del software. (XAMPP) 1 Tipos de páginas Web. Páginas estáticas. Páginas dinámicas. 2 Tipos de páginas Web.
Más detallesEjercicios del bloque de Web de Sistemas de Información:
Ejercicios del bloque de Web de Sistemas de Información: Ejercicio 1: Explica brevemente las principales diferencias entre DTDs y XML Schema. Ejercicio 2: En el contexto de XML qué es un documento bien
Más detallesPartes del formulario
Partes del formulario Etiqueta La etiqueta presenta los siguientes atributos: Comando ACTION METHOD ENCTYPE Descripción El valor de este parámetro es la URL del programa o script en el Servidor
Más detallesPlantilla de texto plano
Plantilla de texto plano Esta es la plantilla seleccionada por defecto al crear una nueva página. Título: Es el título que aparecerá identificando a la página, así como en la cabecera del documento en
Más detallesIngeniería de Sistemas
Ingeniería de Sistemas Desarrollo y Servicios Web Sesión 7 Fernando Barraza A. fbarraza@puj.edu.co Sesión 7 Objetivo: Conocer el lenguaje de programación JavaScript, su estructura y aplicación en el desarrollo
Más detallesEjercicios y cuestiones
1 Ejercicios y cuestiones Objetivos.- Dominar los conceptos fundamentales de la programación script cliente. Identificar y utilizar adecuadamente las estructuras básicas de programación de Javascript/DOM.
Más detallesLABORATORIO Nº 2 GUÍA PARA REALIZAR FORMULAS EN EXCEL
OBJETIVO Mejorar el nivel de comprensión y el manejo de las destrezas del estudiante para utilizar formulas en Microsoft Excel 2010. 1) DEFINICIÓN Una fórmula de Excel es un código especial que introducimos
Más detallesTema 6 Parte III. Frameworks web para dispositivos móviles
Tema 6 Parte III Frameworks web para dispositivos móviles 2 1 Introducción Frameworks web para dispositivos móviles Frameworks web para móviles Frameworks web para móviles 3 Nos permiten desarrollar un
Más detallesHojas de Estilos - CSS. Desarrollo de Aplicaciones Web Departamento Informática y Sistemas Universidad de Murcia Curso 2014/15
Hojas de Estilos - CSS Desarrollo de Aplicaciones Web Departamento Informática y Sistemas Universidad de Murcia Curso 2014/15 Introducción Motivación: Separar el formato del contenido y estructura de una
Más detallesCarlos Roberto Jaimez González. Programación de Web Dinámico
Carlos Roberto Jaimez González Programación de Web Dinámico Carlos Roberto Jaimez González Programación de Web Dinámico Esta investigación fue dictaminada por pares académicos Clasificación Dewey: 005.13
Más detallesResumen Rápido de CSS
Resumen Rápido de CSS Selectores. Resumimos la manera de seleccionar los elementos a ''lookear''. * Todos los elementos div #div #div * Todos los elementos dentro de
Más detallesTablas en HTML. Tipos de celdas. Ing. Tomás Urbina Programación Web y Desarrollo de la Plataforma Web
Tablas en HTML Ing. Tomás Urbina Programación Web y Desarrollo de la Plataforma Web Una tabla HTML puede ser considerada de manera simple como un grupo de filas donde cada una de ellas contiene un grupo
Más detallesTecnología de Programación
Tecnología de Programación Clase 4 Diego C. Martínez Departamento de Ciencias e Ingeniería de la Computación Universidad Nacional del Sur PHP Clientes y servidores... MiPagina ...
Más detallesTEMA 4. Introducción a la programación con el lenguaje JavaScript. Tecnologías de la Información 1ºBachillerato IES Zurbarán (Badajoz)
TEMA 4. Introducción a la programación con el lenguaje JavaScript Tecnologías de la Información 1ºBachillerato IES Zurbarán (Badajoz) Sesión 9 Formularios, funciones y eventos 1 Introducción etiquetas
Más detallesWinHIPE: edición, compilación y ejecución de programas; y generación de animaciones web. Manual de usuario.
WinHIPE: edición, compilación y ejecución de programas; y generación de animaciones web. Manual de usuario. Índice contenido. INTRODUCCIÓN... 1-2 1. ENTORNO DE TRABAJO... 1-2 2. EDICIÓN DE PROGRAMAS...
Más detallesPráctica 2: Diseño Web inicial. XHTML avanzado.
Grado de Información y Documentación Curso 2011-2012 33864-Informática II Práctica 2: Diseño Web inicial. XHTML avanzado. 1. Introducción y objetivos Introducción En esta práctica el alumno tendrá un tema
Más detallesTema 3.1: Principios de diseño web accesibles
Tema 3.1: Principios de diseño web accesibles Lourdes Moreno, Paloma Martínez Universidad Carlos III de Madrid {lmoreno,pmf}@inf.uc3m.es Asignatura Humanidades: Evitando las barreras de accesibilidad en
Más detallesPROYECTO MIS IMÁGENES,
Jose Ignacio González Gómez. Departamento de Economía Financiera y Contabilidad Universidad de La Laguna www.jggomez.eu Tema: Script para subir ficheros a través de un formulario y almacenar otros campos
Más detallesCAJA DE ESQUINAS REDONDEADAS Y ANCHO FIJO ver. 3
ver. 3 Diseño de cajas de esquinas redondeadas y ancho fijo para Diseño WEB _TICO 1º Bachillerato página 1/10 CAJA DE ESQUINAS REDONDEADAS Y ANCHO FIJO ver. 3...1 Procedimiento 1: Diseño con Gimp de una
Más detalles1 OBJETOS, DOM, JSON
OBJETOS, DOM, JSON 1 2 Objetos http://www.w3schools.com/js/js_obj_intro.asp Se delimitan con llaves. Contienen propiedades. Las propiedades del objeto: pares nombre: valor, separados por comas. var alumno
Más detallesDiseño de páginas web
Diseño de páginas web Formularios Ricardo Esteban Alonso Insertar Formularios (1) Permiten que el visitante envíe información al servidor web, que la procesa y la almacena o bien se nos envía a través
Más detallesDiseño de páginas web
Diseño de páginas web Utilidades en Dreamweaver Ricardo Esteban Alonso Preferencias. Edición En el menú Edición > Preferencias...,podemos modificar a nuestro gusto las opciones que de forma predeterminada
Más detalles2.5. Manipular objetos y formularios en una página Web.
2.5. Manipular objetos y formularios en una página Web. Un formulario es una página web en la cual el usuario puede introducir información que posteriormente recibiremos para que sea procesada, por alguna
Más detallesCSS1. manual de referencia. Autor: Jorge Sánchez (www.jorgesanchez.net) año 2003
CSS1 manual de referencia Autor: Jorge Sánchez (www.jorgesanchez.net) año 2003 Basado en la normativa sobre CSS1 disponible en: http://www.w3.org/tr/1999/rec-css1-19990111 Manual de referencia de CSS1-
Más detallesModulo 1 El lenguaje Java
Modulo 1 El lenguaje Java 13 - Codificación en Java Una de las grandes diferencias entre Java y Pascal en cuando a la codificación es que Java se trata de un lenguaje de los llamados case sensitive Esto
Más detallesProgramación en Javascript II
Programación en Javascript II Introducción al manual II de Javascript En esta segunda parte del manual de Javascript vamos a tratar de explicar todos los recursos con los que cuenta un programador de Javascript
Más detallesGuía (muy) básica de hojas de estilo (CSS) y de marcado semántico de páginas web (v1.)
Guía (muy) básica de hojas de estilo (CSS) y de marcado semántico de páginas web (v1.) 1. Hojas de estilo: una base para el marcado semántico Lluís Codina UPF. Abril 2007 Una hoja de estilo es un conjunto
Más detallesCentro de Capacitación en Informática
Fórmulas y Funciones Las fórmulas constituyen el núcleo de cualquier hoja de cálculo, y por tanto de Excel. Mediante fórmulas, se llevan a cabo todos los cálculos que se necesitan en una hoja de cálculo.
Más detallesLaboratorio 8. Hojas de estilo, plantillas y bibliotecas en Dreamweaver
UNIVERSIDAD CARLOS III DE MADRID. ESCUELA DE TURISMO. Informática aplicada al sector turístico Laboratorio 8. Hojas de estilo, plantillas y bibliotecas en Dreamweaver En esta práctica guiada vamos a ver
Más detallesFlash. Los chilos de la Web: Recordando la Web. Etiquetas de HTML. Recuerda 12/04/13 HTML = ESTRUCTURA CSS = DISEÑO DE LA ESTRUCTURA
Flash Tecnología Desarrollada por Macromedia en 1995, y posteriormente adquiridad por Adobe, para la manipulación de Vectores, Gráficos, Audio y Video. Actual y recientemente descontinuada en dispositivos
Más detallesPASOS PARA CREAR UNA PÁGINA WEB
http://www.rafatux.com PASOS PARA CREAR UNA PÁGINA WEB Con éste documento trato de orientar de una forma genérica los distintos pasos que deben de realizarse para crear una página web. PRIMER PASO: Estructura
Más detallesAplicación práctica de PHP en la que construimos un calendario que muestra el mes y año actual y permite moverse a otro mes y año.
Calendario PHP Aplicación práctica de PHP en la que construimos un calendario que muestra el mes y año actual y permite moverse a otro mes y año. Introducción al calendario PHP En este pequeño manual vamos
Más detallesCÓMO DESCARGAR E INSERTAR O INSTALAR PLUGINS O BOTONES DE FACEBOOK EN NUESTRA PÁGINA WEB: ME GUSTA. (DV00503A)
APRENDERAPROGRAMAR.COM CÓMO DESCARGAR E INSERTAR O INSTALAR PLUGINS O BOTONES DE FACEBOOK EN NUESTRA PÁGINA WEB: ME GUSTA. (DV00503A) Sección: Divulgación Categoría: Servicios web gratuitos Fecha revisión:
Más detalles1 DISEÑO WEB de ANCHO FIJO con 2 COLUMNAS FLOTANTES
Diseño WeB de ancho fijo con 2 columnas flotantes _TIN 1º Bachillerato página 1/5 1 DISEÑO WEB de ANCHO FIJO con 2 COLUMNAS FLOTANTES..1 1.1 Diseños de ancho fijo, elástico y líquido.1 1.2 Diseño de ancho
Más detallesPrograma por Clase. 8. CSS3 9. Ejercicio Práctico 10. Examen
Curso CSS Clase 5 Programa por Clase 1. Repaso HTML. Introducción. Reglas CSS internas. 2. Etiquetas básicas de CSS (tipografía, subrayado, etc.) 3. Archivos CSS externos. Colores. Imágenes. 4. Modelo
Más detallesGestión de eventos y formularios en JavaScript.
TEMA 5 Contenido 1.- El objeto Form.... 1 1.1.- Formas de selección del objeto Form....2 1.2.- El formulario como objeto y contenedor....3 1.3.- Acceso a propiedades y métodos del formulario....4 Propiedad
Más detallesObjetivos de la práctica: - Practicar uso de ficheros: abrir, cerrar y tratamiento de información contenida en el fichero.
Objetivos de la práctica: - Practicar uso de ficheros: abrir, cerrar y tratamiento de información contenida en el fichero. Uso de Ficheros Todas las estructuras de datos vistas hasta ahora utilizan la
Más detallesUNIVERSIDAD DON BOSCO FACULTAD DE ESTUDIOS TECNOLOGICOS ESCUELA DE COMPUTACION
UNIVERSIDAD DON BOSCO FACULTAD DE ESTUDIOS TECNOLOGICOS ESCUELA DE COMPUTACION CICLO 01-2015 GUIA DE LABORATORIO Nº 3 Nombre de la practica: Aplicación de Hojas de estilo Lugar de ejecución: Laboratorio
Más detallesEXTENSIÓN DE UML PARA APLICACIONES WEB
EXTENSIÓN DE UML PARA APLICACIONES WEB 1. Descripción Esta extensión de UML define un conjunto de estereotipos, valores etiquetados y restricciones que nos permiten modelar aplicaciones web. Los estereotipos
Más detallesSOLUCION EJERCICIOS VALIDACION DE FORMULARIOS
SOLUCION EJERCICIOS VALIDACION DE FORMULARIOS Vamos a crear con formulario con los componentes más usuales, editor de texto, área de texto, un conjunto de radio botones, un par de checkbox, y una lista
Más detallesObjetivo: Introducción conceptual y aplicación básica de los lenguajes del lado del servidor.
Sesión 03: Lenguajes web del servidor Competencias a Conseguir: - Conocer el entorno de trabajo a nivel de servidores web. - Instalación del localhost (Servidor Local). - Repaso general de PHP y ejercicios
Más detallesDISEÑOS DE PÁGINAS WEB CON N.V.U. E INICIACIÓN AL CÓDIGO HTML
DISEÑOS DE PÁGINAS WEB CON N.V.U. E INICIACIÓN AL CÓDIGO HTML Una página web es un documento escrito empleando un lenguaje denominado HTML (Hyper text Markup language; Lenguaje de marcas de hipertexto).
Más detallesZCARTAS: Iniciación a la suma y resta de números enteros... 4. Introducción... 4. Actividad 1: Escenario con cartas numeradas desde -2 hasta 2...
CONTENIDO ZCARTAS: Iniciación a la suma y resta de números enteros... 4 Introducción... 4 Actividad 1: Escenario con cartas numeradas desde -2 hasta 2... 4 Contenidos trabajados... 4 Instrucciones de Scratch...
Más detallesTema 6. Reutilización de código. Programación 2015-2016. Programación - Tema 6: Reutilización de código
Tema 6 Reutilización de código Programación 2015-2016 Programación - Tema 6: Reutilización de código 1 Tema 6. Reutilización de código Modularidad. Implementación de métodos. Uso de métodos. Programación
Más detallesHTML-5 / DIVS + IFRAMES. Prof: Moisés Mañas Moimacar@esc.upv.es
HTML-5 / DIVS + IFRAMES Prof: Moisés Mañas Moimacar@esc.upv.es Básico Define una división o sección en un documento Atributos: align= left/right/center/justify Alineación de la división
Más detallesCÓMO CREAR NUESTRO CATÁLOGO
CÓMO CREAR NUESTRO CATÁLOGO Mediante la aplicación (http://www.prensasoft.com/programas/conline) podemos crear nuestros propios catálogos. Para crear un catálogo necesitamos: - Varios productos que mostrar,
Más detallesLa plantilla propone aprovechar esta estructura en común y sólo modificar el contenido del área del documento que sea diferente.
PLANTILLAS EN PHP El concepto de plantilla, es un criterio del desarrollo web que propone optimizar la cantidad de documentos HTML que se usan en el desarrollo de un sitio web. A lo largo de la navegación
Más detallesAspectos avanzados de jquery Mobile
Aspectos avanzados de jquery Mobile Índice 1 Listados de elementos... 2 1.1 Listados básicos con enlaces...2 1.2 Listados anidados...3 1.3 Listados numerados... 4 1.4 Listados de solo lectura...5 1.5 Listados
Más detalles5.4. Manual de usuario
5.4. Manual de usuario En esta sección se procederá a explicar cada una de las posibles acciones que puede realizar un usuario, de forma que pueda utilizar todas las funcionalidades del simulador, sin
Más detallesMi primera web... Pues bien una vez que tengamos el documento abierto, podemos empezar a trabajar de dos formas:
Mi primera web... El ejemplo que utilizaremos para este tutorial, es la misma página web de los tutoriales. Puede descargar los archivos desde aquí. Para la creación de las imagenes he utilizado Fireworks
Más detallesTema 7. Construcción de Applets en Java
Programación en Java Tema 7. Construcción de Applets en Java Luis Rodríguez Baena Facultad de Informática Applets Aplicación Java que se ejecuta dentro de un cliente web para ampliar las capacidades de
Más detalleslenguaje de hojas de estilos creado para controlar el aspecto o presentación de los documentos definidos con HTML y XHTML
: Introducción En la primera parte del curso (XHTML) se comentó en numerosas ocasiones que el aspecto de la página podía modificarse mediante las hojas de estilo. Qué es el? es un lenguaje de hojas de
Más detallesSquipy v1.1. 0.-Introducción
Squipy v1.1 0.-Introducción Squipy es un sencillo proxy que permite filtrar y modificar los datos que se envían desde el navegador hacia un servidor web. El interfaz está en castellano y en inglés y su
Más detallesLo básico de Javascript. ISIS2603 Departamento de Sistemas y Computación Universidad de los Andes
Lo básico de Javascript ISIS2603 Departamento de Sistemas y Computación Universidad de los Andes Javascript Permite extender las capacidades de HTML Se utiliza principalmente del lado del cliente para
Más detallesPara crear formularios se utiliza la barra de herramientas Formulario, que se activa a través del comando Ver barra de herramientas.
Formularios TEMA: FORMULARIOS. 1. INTRODUCCIÓN. 2. CREACIÓN DE FORMULARIOS. 3. INTRODUCIR DATOS EN UN FORMULARIO. 4. MODIFICAR UN FORMULARIO 5. MANERAS DE GUARDAR UN FORMULARIO. 6. IMPRIMIR FORMULARIOS.
Más detalles