“Conocimientos Programación>JavaScript Programación

Multiple Rotación Anuncios de JavaScript

2015/2/12
La capacidad de JavaScript para acceder al DOM ( Document Object Model) de una página Web ofrece a los desarrolladores web de los medios para cambiar dinámicamente los atributos de cualquier elemento HTML (Hypertext Markup Language) . El método getElementById JavaScript () permite al programador cambiar el ancho de una etiqueta , altura, fronteras e incluso el "src ", o la propiedad origen de la imagen . Las imágenes se pueden cambiar al azar o secuencialmente . La etiqueta debe estar marcado con un identificador antes el método getElementById () se puede acceder a él. Timing Banner Imagen Cambia setInterval

de JavaScript ( ) función provoca eventos después de un período de tiempo determinado transcurrido, y seguirá para lanzar el evento a menos que sea detenido por el método clearInterval (). SetInterval ( ) toma dos parámetros : la función que desea ejecutar y la cantidad de tiempo que debe transcurrir antes de ejecutarlo. Usted puede tener setInterval () llama a un script que hace girar la fuente de imagen de banner cada pocos segundos o al azar. El programa de código siguiente llama a una función que cambia la bandera cada cinco segundos

Messenger language="javascript">

setInterval ( " changeAdBanner ()" , 5000) ; .

< /script>
Acceso a la etiqueta de imagen a través del DOM

la función JavaScript llama " getElementById ()" y " getElementsByName ()" puede acceder y manipular la página web DOM. " GetElementById ()" puede llegar a los elementos HTML directamente . Por otro lado , " getElementsByName ()" almacena todos los elementos del mismo nombre en la página Web en una matriz. Para cambiar una etiqueta específica , por ejemplo , se le debe dar una clase única o nombre de identificación. Desde cada banner puede ser representado por su propio ID , el " getElementById (): es el método más fácil de usar La siguiente declaración accederá una etiqueta con el ID . " Ad " y cambie su fuente de imagen a" banner2 . . jpg "

document.getElementById ( " ad " ) banner2.jpg " src = ". ;
Random Banner rotación de la imagen
< p > Sus banderas puede ser programado para cambiar de forma aleatoria en lugar de secuencialmente . La función de JavaScript Math.random ( ) genera un número aleatorio entre 0 y 1 . multiplicar este número por 3 produce un número aleatorio que oscila entre 0 y 3 . La Matemáticas funciones. piso () redondea el número a un entero . Finalmente , añadiendo un 1 al resultado limita el conjunto de los números de 1 , 2 ó 3. la siguiente función sustituye al azar uno de tres imágenes almacenadas en una matriz que se llama publicidad .

changeAd function () {

NextBannerImage = 1 + Math.floor ( Math.random () * 3 ) ;

document.getElementById ( "ad" ) . src = anuncios [ NextBannerImage ] ; .

}
secuencial Banner rotación de la imagen

sus banderas también se pueden programar para cambiar secuencialmente Si usted tiene una serie de tres imágenes de banner , puede crear un script para mostrar el primer , segundo y tercer elemento de la matriz , a continuación, iniciar el conteo más . Cada vez que el changeAd () de abajo se llama , un 1 se agrega a la barra " NextBannerImage "y la siguiente imagen de la matriz se hizo la fuente . una vez que la cuenta llegue a 3 , el contador se pone a 0 . Utilice la función setInterval () para llamar a este después de un intervalo de tiempo establecido .

NextBannerImage var = 0 ; //variable global accesible a la función

changeAdBanner función () {


NextBannerImage + + ;

document.getElementById . ( "ad" ) src = anuncios [ NextBannerImage ] ;

if ( NextBannerImage == 3 ) {


NextBannerImage = 0 ;

}

}

JavaScript Programación
Cómo analizar una cadena de consulta en JavaScript
Cómo determinar las coordenadas de un elemento con JavaScript
Cómo utilizar el API de Google Maps distancia de radio
Cómo eliminar una barra de direcciones en HTML
Cómo utilizar HREF JavaScript Links
Cómo utilizar el Desplazamiento de texto en Javascript
Cómo quitar el último hijo de una Div jQuery
Los mejores Javascript Sliders Imagen
Conocimientos Informáticos © http://www.ordenador.online