Ir para conteúdo
Fórum Script Brasil
  • 0

Mudar a foto ao clicar no menu


Everton Rodrigo

Pergunta

8 respostass a esta questão

Posts Recomendados

  • 0

i aew Everton Rodrigo, bom criei um exemplo bem tosco aqui, só para exemplicar, ai você pode ir modificando, qualquer coisa vai perguntando que tentamos ajudar, abraço!

<div id="menu">
		<ul id="menuLista" style="list-style-type:none;">
			<li><a href="#">firefox</a></li>
			<li><a href="#">fedora</a></li>
			<li><a href="#">java</a></li>
		</ul>
	</div>
	<div id="imagem">
		<img src="http://www.google.com.br/intl/en_com/images/srpr/logo1w.png" alt="google" title="google"/>
	</div>
e o js fica assim:
window.onload = function(){
        var objUl = document.getElementsByTagName("ul");
        var objDiv = document.getElementById("imagem");
        modificaImagemAoClickarNoLink(objUl[0],objDiv);
    }
    
    function modificaImagemAoClickarNoLink(objUl,objImagem){

        var getImagens = function(indice){
            json = new Array();
            json[0] = {src:"http://2.bp.blogspot.com/_1i7EX7a2ELY/TKczkHyEgUI/AAAAAAAAAY8/dOud9ZpEqfU/s400/Tux_FirefoxSyvolc.png",title:"firefox",alt:"firefox"};
            json[1] = {src:"http://olea.org/ilustraciones/fedora-logo-icon.png",title:"fedora",alt:"fedora"};
            json[2] = {src:"http://2.bp.blogspot.com/-btYW4MasCLM/TOV8Vm9FRbI/AAAAAAAAA1A/GOY-oUw2IbE/s1600/Java-logo-YesParK.png",title:"java",alt:"java"};
            return json[indice];
        }

        var criaImagem = function(imageJson){
            var imagem = new Image();
            imagem.src = imageJson.src;
            imagem.alt = imageJson.alt;
            imagem.title = imageJson.title;
            return imagem;
        }

        var addEventClick = function(indice){
            imageJson = getImagens(indice);
            objImagem.innerHTML = "";
            objImagem.appendChild(criaImagem(imageJson));
            return false;
        }

        var menuLinks = objUl.getElementsByTagName("a");
        var imageJson;
        

        for ( var i = 0; i < menuLinks.length; i++ ){
            menuLinks[i].setAttribute("indice", i);
            menuLinks[i].onclick = function(){
                addEventClick(this.getAttribute("indice"));
            }
        }
    }

espero que ajude, abraço!

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...