Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
[Dúvida] Logo Rotativo
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
[Dúvida] Logo Rotativo
Boa noite,
Quero inserir um logo/banner rotativo em meu fórum e segui os passos desse guia: https://ajuda.forumeiros.com/t22323-tutorial-logo-rotativo
Portanto, o código da página HTML ficou:
E o código da descrição do fórum ficou:
Porém, não resultou na rotatividade, como proceder?
Quero inserir um logo/banner rotativo em meu fórum e segui os passos desse guia: https://ajuda.forumeiros.com/t22323-tutorial-logo-rotativo
Portanto, o código da página HTML ficou:
- Código:
var banner = new Array();
banner[0]='http://giant.gfycat.com/SelfreliantRequiredHarvestmouse.gif';
banner[1]='http://i57.tinypic.com/mrczkl.gif';
document.getElementById('logo').firstChild.src= banner[Math.floor(Math.random()*banner.length)];
setInterval("document.getElementById('logo').firstChild.src= banner[Math.floor(Math.random()*banner.length)];",6000);
E o código da descrição do fórum ficou:
- Código:
<script src=http://www.tutorialdoca.com/h23-banner-rotativo></script>O seu Database detalhado sobre o FPS Combat Arms Brasil.
Porém, não resultou na rotatividade, como proceder?
Última edição por ZombieW em 24.08.14 22:10, editado 1 vez(es)
Re: [Dúvida] Logo Rotativo
Olá,
Fiz um código novo para o senhor, deve funcionar
Esta vendo os links ali? Basta alterar para as URL's desejadas.
Para inserir novos basta inserir uma vírgula e entre aspas colocar o link do seu novo logo, note que o último logo não recebe uma vírgula.
Toda vez que atualizar o fórum terá um novo logo.
Até mais...
Fiz um código novo para o senhor, deve funcionar
- Código:
window.addEventListener('DOMContentLoaded', function() {
var urls = [
'https://cdn0.iconfinder.com/data/icons/ballicons/128/coffee-128.png',
'https://cdn0.iconfinder.com/data/icons/ballicons/128/chemistry-128.png',
'https://cdn0.iconfinder.com/data/icons/ballicons/128/rocket-128.png',
'https://cdn0.iconfinder.com/data/icons/ballicons/128/study_hat-128.png'
],
random = function(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
},
logo = urls.length;
document.querySelector('#logo img').src = urls[random(0, logo)];
});
Esta vendo os links ali? Basta alterar para as URL's desejadas.
Para inserir novos basta inserir uma vírgula e entre aspas colocar o link do seu novo logo, note que o último logo não recebe uma vírgula.
Toda vez que atualizar o fórum terá um novo logo.
Até mais...
Re: [Dúvida] Logo Rotativo
Na verdade, eu gostaria que o banner fosse alterado a cada 6000ms como o código acima mostra, e não a cada F5.
Re: [Dúvida] Logo Rotativo
Altere para este:
Até mais.
- Código:
window.addEventListener('DOMContentLoaded', function() {
var urls = [
'https://cdn0.iconfinder.com/data/icons/ballicons/128/coffee-128.png',
'https://cdn0.iconfinder.com/data/icons/ballicons/128/chemistry-128.png',
'https://cdn0.iconfinder.com/data/icons/ballicons/128/rocket-128.png',
'https://cdn0.iconfinder.com/data/icons/ballicons/128/study_hat-128.png'
],
random = function(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
},
logo = urls.length;
window.setInterval(function() {
document.querySelector('#logo img').src = urls[random(0, logo)];
}, 6000);
});
Até mais.
Re: [Dúvida] Logo Rotativo
Não funciona. Está correto como está na descrição do site?
- Código:
<script src=http://www.tutorialdoca.com/h23-banner-rotativo></script>O seu Database detalhado sobre o FPS Combat Arms Brasil.
Re: [Dúvida] Logo Rotativo
Como eu disse, eu fiz um código novo. Por favor, remova qualquer código antigo e mantenha apenas o que lhe passei.
Re: [Dúvida] Logo Rotativo
Poderia ter me informado que era um JS e não uma HTML, como eu havia dito.
Funcionou, porém, o fórum está bem pesado com isso, é normal?
Funcionou, porém, o fórum está bem pesado com isso, é normal?
Re: [Dúvida] Logo Rotativo
Olha, em meus testes eu não notei nenhum atraso no carregamento do fórum, não seria o fato das imagens serem grandes ou coisa assim?
Note que o código é pequeno, e leve. Não acredito que isso seja causado por ele...
Note que o código é pequeno, e leve. Não acredito que isso seja causado por ele...
Re: [Dúvida] Logo Rotativo
Ao trocar um banner pelo outro, o site "pisca", fazendo uma "travada" e as vezes fica sem banner, aparece essa imagem como se estivesse expirado:
Re: [Dúvida] Logo Rotativo
Vou fazer um esquema mais caprichado para você aqui, pode me enviar a imagem de todos os banners para que possa realizar as modificações necessárias para o senhor?
Outra coisa, quero que me envie o código que está usando atualmente também, o que o senhor editou.
Até mais.
Outra coisa, quero que me envie o código que está usando atualmente também, o que o senhor editou.
Até mais.
Re: [Dúvida] Logo Rotativo
- Código:
window.addEventListener('DOMContentLoaded', function() {
var urls = [
'http://giant.gfycat.com/SelfreliantRequiredHarvestmouse.gif',
'http://s4.uploads.im/S8yN7.gif',
],
random = function(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
},
logo = urls.length;
window.setInterval(function() {
document.querySelector('#logo img').src = urls[random(0, logo)];
}, 12000);
});
Re: [Dúvida] Logo Rotativo
Agora deve funcionar bem.
Fiz o script para checar se o logo está no viewport, ou seja se ele está visível na tela do usuário. Caso esteja, ele fica trocando como você deseja, do contrário ele não faz nada, assim evitamos cálculos desnecessários.
Volte na minha postagem la em cima e releia minha mensagem, veja:
O senhor inseriu uma vírgula no último logo no código que me passou, fique atento a isso.
O problema de aparecer um logo inexistente foi resolvido, e em relação a performance acredito que também vai melhorar.
Queira testar o resultado por favor.
Fiz o script para checar se o logo está no viewport, ou seja se ele está visível na tela do usuário. Caso esteja, ele fica trocando como você deseja, do contrário ele não faz nada, assim evitamos cálculos desnecessários.
Volte na minha postagem la em cima e releia minha mensagem, veja:
waghcwb escreveu:note que o último logo não recebe uma vírgula.
O senhor inseriu uma vírgula no último logo no código que me passou, fique atento a isso.
O problema de aparecer um logo inexistente foi resolvido, e em relação a performance acredito que também vai melhorar.
Queira testar o resultado por favor.
- Código:
window.addEventListener('DOMContentLoaded', function() {
var urls = [
'http://giant.gfycat.com/SelfreliantRequiredHarvestmouse.gif',
'http://s4.uploads.im/S8yN7.gif'
],
pics = urls.length,
logo = document.querySelector('#logo img');
window.onscroll = function() {
if (iv(logo) == false) return;
window.setInterval(function() {
logo.src = urls[randoms(0, pics - 1)];
}, 1000);
}
});
function iv(element) {
var eap,
rect = element.getBoundingClientRect(),
doc = document.documentElement,
vWidth = window.innerWidth || doc.clientWidth,
vHeight = window.innerHeight || doc.clientHeight,
fromPoint = function(x, y) {
return document.elementFromPoint(x, y)
},
contains = "contains" in element ? "contains" : "compareDocumentPosition",
has = contains == "contains" ? 1 : 0x14;
if (rect.right < 0 || rect.bottom < 0 || rect.left > vWidth || rect.top > vHeight)
return false;
return (
(eap = fromPoint(rect.left, rect.top)) == element || element[contains](eap) == has || (eap = fromPoint(rect.right, rect.top)) == element || element[contains](eap) == has || (eap = fromPoint(rect.right, rect.bottom)) == element || element[contains](eap) == has || (eap = fromPoint(rect.left, rect.bottom)) == element || element[contains](eap) == has
);
};
function randoms(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
Re: [Dúvida] Logo Rotativo
Olá amigo, copiei o último código passado por você e inseri no JS, não houve rotação nenhuma.
O fórum está fixo na 1ª imagem.
O fórum está fixo na 1ª imagem.
Re: [Dúvida] Logo Rotativo
Então, agora o script só é ativado, quando acontece um scroll no mouse, para evitar cálculos a toa...
Se desejar eu coloco para iniciar automaticamente.
Ele está funcionando, mas está trocando bem rápido, não esqueça de modificar o tempo para o desejado.
Se desejar eu coloco para iniciar automaticamente.
Ele está funcionando, mas está trocando bem rápido, não esqueça de modificar o tempo para o desejado.
Re: [Dúvida] Logo Rotativo
Não tinha notado isso no scroll, mas acho meio inútil não? Eu vou rolar para baixo, ele vai trocar e depois eu não vou ver o banner...rs
Por favor, deixe para automático.
Por favor, deixe para automático.
Re: [Dúvida] Logo Rotativo
- Código:
window.addEventListener('DOMContentLoaded', function() {
var urls = [
'http://giant.gfycat.com/SelfreliantRequiredHarvestmouse.gif',
'http://s4.uploads.im/S8yN7.gif'
],
pics = urls.length,
logo = document.querySelector('#logo img');
if (iv(logo) == false) return;
window.setInterval(function() {
logo.src = urls[randoms(0, pics - 1)];
}, 1000);
});
function iv(element) {
var eap,
rect = element.getBoundingClientRect(),
doc = document.documentElement,
vWidth = window.innerWidth || doc.clientWidth,
vHeight = window.innerHeight || doc.clientHeight,
fromPoint = function(x, y) {
return document.elementFromPoint(x, y)
},
contains = "contains" in element ? "contains" : "compareDocumentPosition",
has = contains == "contains" ? 1 : 0x14;
if (rect.right < 0 || rect.bottom < 0 || rect.left > vWidth || rect.top > vHeight)
return false;
return (
(eap = fromPoint(rect.left, rect.top)) == element || element[contains](eap) == has || (eap = fromPoint(rect.right, rect.top)) == element || element[contains](eap) == has || (eap = fromPoint(rect.right, rect.bottom)) == element || element[contains](eap) == has || (eap = fromPoint(rect.left, rect.bottom)) == element || element[contains](eap) == has
);
};
function randoms(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
Re: [Dúvida] Logo Rotativo
Não resultou, está fixo na 1ª imagem.
@Edit
Sim resultou, está correto agora. Peço desculpas por falar que não tinha ocorrido, não tinha de fato, demorou alguns minutos para funcionar.
Obrigado.
@Edit
Sim resultou, está correto agora. Peço desculpas por falar que não tinha ocorrido, não tinha de fato, demorou alguns minutos para funcionar.
Obrigado.
Re: [Dúvida] Logo Rotativo
Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada. Tópico marcado como Resolvido e movido para "Questões resolvidas". |
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre códigos :: Questões resolvidas sobre HTML e BBCode
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos