Alternar páginas HTML ao carregar

Binhofa · Abril 8, 2012

Olá pessoal

Tenho uma página html e gostaria de alternar a cada carregamento do internauta. Sei que é uma coisa bem simples, mas garimpei e só achei para alternar imagens... agora páginas não.

Ex.: Tenho um index1.html, index2.html, index3.html e quando carregar o www.nomedosite.com.br, o sistema escolhe qual quer aparecer. Quando eu der F5, ele aparece outro.... e assim por diante.

Obrigado turma e fico no aguardo.

Valdeir Info · Abril 9, 2012

<html>
<body>

<p id="demo">Click the button to display a random number.</p>

<button onclick="myFunction()">Try it</button>

<script type="text/javascript">
function myFunction()
{
var paginas = new Array("index1.html", "index2.html", "index3.html");
posicaoArray=Math.floor(Math.random() * paginas.length);

//Pode usar assim
window.location.href=paginas[posicaoArray];

//ou com jQuery
$("div").load(paginas[posicaoArray]);

}
</script>

</body>
</html>

angelorubin · Abril 9, 2012

Bom dia,

Acho que isso resolve.

JavaScript

<script type="text/javascript">

var paginas = ["index.html","01.html","02.html","03.html"]

var pagRand = paginas[Math.floor(Math.random()*paginas.length)]

window.location = pagRand;

</script>

Binhofa · Abril 15, 2012

Que maravilha! Obrigado pela ajuda de vocês pessoal.

Gostaria de ter a ousadia de pedir mais uma contribuição: Usando esses códigos trocando o HTML por imagens PNG (A.png e B.png), quando vou teclando F5, a imagem A.png fica sobre B.png, ficando visivelmente exposto atrás dela a outra imagem. QUal é a forma quando for aparecer a imagem A, ela "limpar" o conteúdo todo B e só aparecer uma apenas?

Ex.: Usando o código do angelorubin

_________________________________________________________________

var paginas = ["a.png","b.png"]

var pagRand = paginas[Math.floor(Math.random()*paginas.length)]

window.location = pagRand;

</script>

_________________________________________________________________

Detalhe: As imagens estão em PNG com fundo transparente, pois o fundo de tela tem que "casar" com as duas imagens.

Não sei se fui claro, mas qualquer coisa explicarei mais detalhadamente.

Obrigado mais uma vez, pessoal.

Tato.. · Abril 19, 2012

Que maravilha! Obrigado pela ajuda de vocês pessoal.

Gostaria de ter a ousadia de pedir mais uma contribuição: Usando esses códigos trocando o HTML por imagens PNG (A.png e B.png), quando vou teclando F5, a imagem A.png fica sobre B.png, ficando visivelmente exposto atrás dela a outra imagem. QUal é a forma quando for aparecer a imagem A, ela "limpar" o conteúdo todo B e só aparecer uma apenas?

Ex.: Usando o código do angelorubin

_________________________________________________________________

<script type="text/javascript">

var paginas = ["a.png","b.png"]

var pagRand = paginas[Math.floor(Math.random()*paginas.length)]

window.location = pagRand;

</script>

_________________________________________________________________

Detalhe: As imagens estão em PNG com fundo transparente, pois o fundo de tela tem que "casar" com as duas imagens.

Não sei se fui claro, mas qualquer coisa explicarei mais detalhadamente.

Obrigado mais uma vez, pessoal.

bom, você pode usar um hide vou tentar fazer um exemplo meio por cima.

<script type="text/javascript">
       $(document).ready(function(){
             $("#id_da_img").hide();
             $("#id_da_img1").hide();
             $("#id_da_img2").hide();
             $("#id_da_img3").hide();
       })
       var img = ["#id_da_img","#id_da_img1","#id_da_img2","#id_da_img3"]

       var imgRand = img[Math.floor(Math.random()*img.length)]

       $(imgRand).show;

</script>

Lembrando que pra isso você precisa ter o jQuery na sua página. Bom, não testei o código, mas uma coisa mais ou menos assim deve funcionar.

Binhofa · Abril 21, 2012

Tato, obrigado pela ajuda, mas não consegui executar os procedimentos acima. O que pode estar errado?

Obrigado e fico no aguardo!

Tato.. · Abril 25, 2012

Tato, obrigado pela ajuda, mas não consegui executar os procedimentos acima. O que pode estar errado?

Obrigado e fico no aguardo!

E qual erro está dando?

Binhofa · Abril 25, 2012

Olá Tato

Ele simplesmente não apaga. Fiz o seguinte procedimento:

$(document).ready(function(){

$("#img.jpg").hide();

$("#img1.jpg").hide();

$("#img2.jpg").hide();

$("#img3.jpg").hide();

})

var img = ["#img.jpg","#img1.jpg","#img2.jpg","#img3.jpg"]

var imgRand = img[Math.floor(Math.random()*img.length)]

$(imgRand).show;

</script>

O que estou fzendo de errado? Não consegui entender também o que voce disse sobre o Jquery. Tenho que executar alguma função antes do </HEAD>.

Obrigado mais uma vez e fico no aguardo.

Tato.. · Abril 25, 2012

Olá Tato

Ele simplesmente não apaga. Fiz o seguinte procedimento:

<script type="text/javascript">

$(document).ready(function(){

$("#img.jpg").hide();

$("#img1.jpg").hide();

$("#img2.jpg").hide();

$("#img3.jpg").hide();

})

var img = ["#img.jpg","#img1.jpg","#img2.jpg","#img3.jpg"]

var imgRand = img[Math.floor(Math.random()*img.length)]

$(imgRand).show;

</script>

O que estou fzendo de errado? Não consegui entender também o que voce disse sobre o Jquery. Tenho que executar alguma função antes do </HEAD>.

Obrigado mais uma vez e fico no aguardo.

Você substituiu os "img.jpg" pelo nome das suas imagens?

Binhofa · Abril 25, 2012

é... pela sua resposta, acho que fiz besteira...rsss!

Fiz isso sim. Os meus arquivos na verdade são em PNG (img1.png, img2.png, img3.png.......)

Tato.. · Abril 25, 2012

é... pela sua resposta, acho que fiz besteira...rsss!

Fiz isso sim. Os meus arquivos na verdade são em PNG (img1.png, img2.png, img3.png.......)

kkkkkkkkkkk..

depois de nomear certinho, correu tudo bem? hehehe

ou nao deu ainda? ^^

Binhofa · Abril 25, 2012

Não Tato, nao deu! Tem que habilitar alguma coisa antes da tag </head>? Nao consegui entender sobre esse Jquery que comentou.

Tato.. · Abril 25, 2012

bom, o "#img.jpg" se refere ao ID da imagem o "#" se refere ao ID se foce um "." seria referido a uma classe.

por exemplo


<script type="text/javascript">
$(document).ready(function(){
$("#img").hide();
$("#img1").hide();
$("#img2").hide();
$("#img3").hide();
})
var img = ["#img","#img1","#img2","#img3"]

var imgRand = img[Math.floor(Math.random()*img.length)]

$(imgRand).show;

</script>
<img id="img" scr="imagem.png">
<img id="img1" scr="imagem1.png">
<img id="img2" scr="imagem2.png">
<img id="img3" scr="imagem3.png">

o comando estaria chamando ele..

O que eu tentei te dizer é assim..

Faça uma lista. o que vai acontecer é o seguinte

Quando o documento abrir, primeiro ele vai esconder todas elas, depois vai sortear uma aleatória, e por ultimo mostrar a aleatória.. entendeu?

Binhofa · Maio 3, 2012

Ok, vou executar esses procedimentos e qualquer novidade posto aqui.

Valeu de novo Tato.

Tato, desculpa a demora na resposta. Fui executar esse procedimento somente hoje e..... não deu!

O que estou fazendo é o seguinte

_______________________________________________________________________

$(document).ready(function(){

$("#img").hide();

$("#img1").hide();

})

var img = ["#img","#img1"]

var imgRand = img[Math.floor(Math.random()*img.length)]

$(imgRand).show;

</script>

_______________________________________________________________________

... e ele simplesmente não aparece imagem alguma!!!! :(

O código acima está correto? Tenho que fazer alguma coisa dentro da <head>? Ele funciona para todos os browsers?

Valeu e fico no aguardo.

Tato? Ou alguém?

Me ajuuuuudem...por favor.....rs!

Valeu gente!

Binhofa · Maio 4, 2012

Pessoal, desculpem a minha insistência se não fosse tão urgente, mas realmente não estou conseguindo mesmo achar a solução para este problema. Procurei muito mas nao consigo achar nada em foruns.. nada!!!!

Conto somente com a ajuda de vocês!

Abraços e obrigado.

Arquivado

Alternar páginas HTML ao carregar

Recommended Posts

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Valdeir Info 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

angelorubin 142

Compartilhar este post

Link para o post

Compartilhar em outros sites

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Tato.. 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Tato.. 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Tato.. 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Tato.. 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Tato.. 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Binhofa 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante