Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Fala galera!
Povo, to precisando de uma ajudinha num site que to fazendo. Eu criei um site que funciona como um "guia de bolso", e coloquei um iframe que exibe o conteúdo de acordo com o que o usuário escolher no menu lateral. Em resumo, é uma única página com vários links que exibem conteúdos diferentes nesse iframe.
O que eu quero é que o link que o usuário clicar permaneça diferente dos outros enquanto ele está ativo, e no momento que o usuário clicar em outro aconteça a mesma coisa, e assim por diante. Já tentei de tudo via css, java script, mas não consigo. Alguém aí pode me ajudar?
Desde já agradeço!
>
48 minutos atrás, Omar~ disse:
Tipo assim?
Mostrar conteúdo oculto
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.exemplo {
padding: 1.1rem 2rem;
border: .062rem solid rgba(0,0,0,.5);
background-color: #777777
}
</style>
</head>
<body>
<a class="exemplo" onclick="modifica(0)">Exemplo 1</a>
<a class="exemplo" onclick="modifica(1)">Exemplo 2</a>
<a class="exemplo" onclick="modifica(2)">Exemplo 3</a>
<script>
var $cls = document.getElementsByClassName('exemplo');
var $i;
function modifica(param) {
for ($i = 0; $i < $cls.length; $i++) {
$cls[$i].style.background = '#777777';
}
$cls[param].style.background = '#eeeeee';
}
</script>
</body>
</html>
Amigo, é pra ser isso... mas quando coloquei no meu código ele não funcionou.
Aqui está um trecho do código onde estão os links:
<body>
<nav id="box-toggle">
<div id="tgl1">
<ul>
<li><a href="#" onclick='insereTexto1()'>Item 1</a></li>
</ul>
</div>
<div id="tgl2">
<div id="sub1">
<ul>
<li><a href="#" onclick='insereTexto2()'>Item 2</a></li>
<li><a href="#" onclick='insereTexto3()'>Item 3</a></li>
<li><a href="#" onclick='insereTexto4()'>Item 4</a></li>
<li><a href="#" onclick='insereTexto5()'>Item 5</a></li>
</ul>
</div>
</div>
</nav>
</body>insereTexto1()
Acredito que você se atropelou na hora de executar a função, a arquitetura seria:
funcao(parametro)
>
Citar
#EDIT: Para que funcione também cada link deve ter uma class ao qual a função vai utilizar para saber o que tem que ser executado dentro do DOM
>
9 minutos atrás, Omar~ disse:
insereTexto1()
Acredito que você se atropelou na hora de executar a função, a arquitetura seria:
funcao(parametro)
Cara, na realidade essa função do insereTexto1() é assim mesmo. Mas eu creio que eu deva ter colocado algo errado ali na hora de passar pro meu código, pois agora eu tentei fazer de novo e funcionou! Era exatamente isso que eu precisava!
Muito obrigado pela sua ajuda! Abraço!
Tipo assim?
Spoiler
<!DOCTYPE html>