Ir para conteúdo
  • Cadastre-se

Posts Recomendados

Pessoal,

To precisando de uma ajuda, na verdade quero saber de alguém que entenda bastante de CSS se é possível fazer o que eu quero.

Estou fazendo um site, e no rodapé vai ter um "Acesso Rápido" para os menus, onde vai ter os mesmo menus existentes lá em cima do site.

O que eu queria era que ao passar o mouse sobre um item de menu, uma imagem que está a esquerda aumentasse de tamanho. A imagem e o menu estão na mesma div.

Já dei uma pesquisada e não consegui achar nada a respeito já que a propriedade :hover age somente no objeto selecionado.

Caso tenha ficado dificil de entender, vou citar um exemplo com o próprio fórum.

Imaginemos que ao passar o mouse sobre os botões "MacMagazine", "Membros" ou "Fórum", o logotipo da Macmagazine que está em cima desses menus aumentasse de tamanho.

Espero que tenha ficado claro. Fico no aguardo.

Link para o comentário
Compartilhar em outros sites

  • Respostas 2
  • Criado
  • Última resposta

Top Postadores Neste Tópico

Dias Populares

Top Postadores Neste Tópico

Você consegue aumentar a imagem usando scale (propriedade da CSS3), mas nesse caso como o elemento que você vai alterar não é o elemento onde está o mouse sugiro que use um Js básico aí.

Cria uma classe com o efeito scale que você quer.

Crie também um js que capture o hover e adicione a classe criada em um elemento img

Aqui tem um exemplo do scale http://tableless.com...css-transforms/ o js é mais ou menos isso:


$(function(){
$("#menu").hover(
function(){$(img).addClass("img-scale"),
function(){$(img).removeClass("img-scale") }
);
});

OBS: não testei o JS ;)

Editado por Deblyn Prado
Link para o comentário
Compartilhar em outros sites

Você consegue aumentar a imagem usando scale (propriedade da CSS3), mas nesse caso como o elemento que você vai alterar não é o elemento onde está o mouse sugiro que use um Js básico aí.

Cria uma classe com o efeito scale que você quer.

Crie também um js que capture o hover e adicione a classe criada em um elemento img

Aqui tem um exemplo do scale http://tableless.com...css-transforms/ o js é mais ou menos isso:


$(function(){
$("#menu").hover(
function(){$(img).addClass("img-scale"),
function(){$(img).removeClass("img-scale") }
);
});

OBS: não testei o JS ;)

Valeu pela ajuda, dei uma lida na propriedade scale já, mas não consegui fazer o que queria via JS. Não manjo muito de JS infelizmente...

Link para o comentário
Compartilhar em outros sites

Participe do debate

Você pode postar agora e se registrar depois. Se você tem uma conta, entre agora para postar com ela.

Visitante
Responder este tópico…

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

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Limpar editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Quem Está Navegando   0 membros estão online

    • Nenhum usuário registrado visualizando esta página.



×
×
  • Criar Novo...