Programação  
 
Conhecimento computador >> Programação >> JavaScript Programação >> 
Vários anúncios girando em JavaScript
capacidade de JavaScript para acessar o DOM ( Document Object Model) da página Web dá aos desenvolvedores da Web os meios para mudar dinamicamente os atributos de qualquer HTML ( Hypertext Markup Language ) elemento. O método JavaScript getElementById () permite a mudança programador largura de uma marca , altura, fronteiras e até mesmo o "src ", ou propriedade de origem da imagem. As imagens podem mudar de forma aleatória ou sequencialmente. A marca devem ser rotulados com um ID antes que o método getElementById () pode acessá-lo. Função de temporização Banner Image Mudanças

de JavaScript setInterval () desencadeia os acontecimentos após um período definido de tempo decorrido , e vai continuar a disparar o evento , a menos que seja interrompido pelo método clearInterval (). SetInterval () usa dois parâmetros: a função que você deseja executar e , a quantidade de tempo de espera antes de executá-lo. Você pode ter setInterval () chamar um script que roda a fonte de imagem bandeira a cada poucos segundos ou de forma aleatória. O trecho de programa abaixo chama uma função que muda a bandeira a cada cinco segundos


Acessando o Tag imagem Através do DOM

a função JavaScript chama de " getElementById () " e " getElementsByName ()" pode acesso e manipular a página da Web DOM. " GetElementById ()" pode chegar a elementos HTML diretamente. Por outro lado , " getElementsByName ()" lojas de todos os elementos de mesmo nome na página da Web em uma matriz. Para alterar uma marca específico , por exemplo , deve ser dado um nome de classe única ou ID. Uma vez que cada banner pode ser representada pelo seu próprio ID , o " getElementById (): é o método mais simples de usar A declaração a seguir irá acessar um tag com o ID de . " Ad " e altere a sua fonte de imagem para" banner2 . . . " src = jpg "

document.getElementById ( "ad ) " banner2.jpg ";
banner Randômico rotação da imagem

Seus banners podem ser programados para mudar de forma aleatória e não sequencialmente . a função JavaScript Math.random () gera um número aleatório entre 0 e 1. Multiplicando esse número por 3 produz um número aleatório que varia entre 0 e 3. The Math função. floor () arredonda o número para um inteiro. Finalmente, a adição de um 1 ao resultado limita o conjunto de números 1 , 2 ou 3. a função a seguir substitui aleatoriamente um de três imagens armazenadas em uma matriz que é chamado de anúncios .

função changeAd () {

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

document.getElementById ( "ad" ) . src = anúncios [ NextBannerImage ]; .

}
Sequential bandeira rotação da imagem

seus banners também pode ser programado para mudar sequencialmente Se você tem um conjunto de três imagens de banner , você pode criar um script para exibir o primeiro , segundo e terceiro elemento na matriz , em seguida, iniciar a contagem de novo. Cada vez que o changeAd () função abaixo é chamado, um 1 é adicionado ao contador " NextBannerImage " ea imagem seguinte na matriz é feita a fonte tag . uma vez que a contagem chega a 3 , o contador será reposto a 0 . Use a função setInterval () para chamar isso depois de um intervalo de tempo definido.

var NextBannerImage = 0; //global variável acessíveis para a função

função changeAdBanner () {


NextBannerImage + +;

document.getElementById ( "ad" ) src = anúncios [ NextBannerImage ]; .

if ( NextBannerImage == 3)

{

NextBannerImage = 0; }


}

Anterior :

Próximo : No
  Os artigos relacionados
·Por que meu Javascript Mostrar Proibido 
·Tutorial em jQuery e Google Maps 
·Como obter os deslocamentos de rolagem em JavaScript 
·Os Melhores Sliders Imagem Javascript 
·Como gráfico com jQuery 
·Como desativar Rolagem no Google Maps API V3 
·Como codificar Parâmetros em AJAX 
·Data Diferença em Java Script 
·Como acessar o acelerômetro Via Javascript no Android 
·Lightbox Vs . Lightbox 2 
  Artigos em destaque
·Como o código de um Screensaver 
·Como desfragmentar uma imagem VMWare 
·Como aprender C # Rápido 
·Como extrair um banco de dados de JPA 
·Como fechar serviços WCF 
·Ferramentas Java Desenvolvimento de Jogos 
·Como Mudar De GW- BASIC para QBasic 
·Como criar Myoval & myRectangle Classes 
·Como adicionar um CRM a um POS 
·Como manipular Exibir Lista de Controles no MFC 
Cop e direita © Conhecimento computador http://ptcomputador.com Todos os Direitos Reservados