Introduccion DHTML - Referencias

3 - Referencias

[editar]
Curso gratis creado por Carlos Castillo. Extraido de: http://www.tejedoresdelweb.com/307/article-1058.html
18 de Octubre de 2005
La forma de acceder a los valores de los atributos de un elemento depende del browser utilizado. De esta forma, usando por ejemplo código Javasrcipt, podemos modificar esos valores dándole vida al elemento.

Netscape

Para Netscape, la forma de referenciar un atributo es: document.myObject.atribute = value. Si se tienen elementos anidados se deben especificar ambos elementos, como en document.outer.document.inner.left.

Otra forma de acceder a un atributo es utilizando el arreglo de Layers. Así, solo basta conocer el índice adecuado. Consideremos el siguiente código de ejemplo:

<html>

<div id="outer" style="position:absolute">

<div id="inner" style=" "position:absolute; left:50; top:50"> <img src="http://www.tn.cl/icn/flab1.jpg"> </div>

</div> </html>

De esta forma, si queremos modificar la imagen, lo podemos hacer de dos formas:

document.outer.document.inner.images[0].src = "otro.gif";

document.layers[0].document.layers[0].images[0].src = "otro.gif";

Explorer

Para Explorer, las referencias a los atributos son distintas en sintaxis, pero tienen la ventaja que cuando se tiene bloques anidados, basta solo con especificar el nombre del bloque, sin especificar el o los bloques exteriores. Por ejemplo, si queremos modificar el atributo Left del elemento inner del ejemplo anterior, basta con colocar:

document.all.inner.style.pixelLeft = 200;

Sobre la propiedad pixelLeft volveremos más tarde. Ahora, si queremos modificar la imagen, solo se referencia al índice del arreglo de im´agenes.

document.images[0].src = "otro.gif";

Como ven, la sintaxis es mucho más fácil y más flexible que para Netscape.

Definición de DIV

Una forma alternativa de definir los atributos de un elemento DIV (antes de ser modificados) es mediante hojas de estilo. La sintaxis es:

<html>

<style type="text/css"> #miObj {position: absolute; left:50; background-color:FFFFDD; width:200} </style>

<body>

<div id="miObj"> Algun Contenido... </div>

</body> </html>

Tabla Resumen

A continuación se muestra una tabla resumen, con las propiedades segun se utilice Netscape o Explorer incluyendo una breve descripción descripción.

Netscape Descripcion Explorer

left Distancia borde izquierdo pixelLeft

top Distancia borde superior pixelTop

clip.height Altura contenido visible -

clip.width Ancho contenido visible -

  • Alto del contenido posHeight
  • Ancho del contenido posWidth

visibility Muestra o esconde un objeto visibility

zindex Orden de layering del elemento zindex

background Imagen de fondo background
[editar]

1 opinión

opinion

necesito 20 aspectos de como ocupar dhtml

Cursos gratis relacionados con 'Introduccion DHTML'

Esta tecnologia permite posicionamiento dinamico de elementos, y es la extension natural de la idea... Más »
El diseño web va más allá del diseño gráfico, al influir en él multitud de... Más »
Cuando hablamos de un sitio web nos estamos refiriendo en realidad a un conjunto de... Más »
Los modelos de publicidad en Internet se basan en sus dos principales aplicaciones: el correo... Más »
Para proteger nuestra navegación y filtrar la publicidad disponemos en el mundo windows de los... Más »

Autor y licencia de 'Introduccion DHTML'


Curso gratis de Carlos Castillo. Extraido de: http://www.tejedoresdelweb.com/307/article-1058.html CopyLeft
Los contenidos de este sitio pueden ser reproducidos solamente bajo estas condiciones. La licencia está respaldada con el registro de propiedad intelectual número 97.125 en Chile y otros países.
Este contenido ha sido recopilado por el equipo de Wikilearning. Todo el contenido recopilado se ha obtenido respetando y comunicando en nuestro site la licencia de cada fuente.
Wikilearning tiene permiso expreso por escrito de los autores para publicar los contenidos que ha extraído de otras webs, incluyendo su uso comercial.