4
respostas

Projeto com JS - Dicas

Bom dia pessoal,

Estou tentando fazer um projeto HTML, CSS e JS. Minha ideia é fazer uma imagem interativa.

Seria uma imagem fixa, como no google maps, onde eu possa dar zoom in e zoom out para selecionar o objeto com mais facilidade ou ter uma visão panorâmica.

Quando passa o ponteiro em cima do objeto gostaria de abrir uma caixa ao lado com umas informações, e quando clicasse abrisse outra página.

Queria ter uma dica como pesquisar? Eu tenho uma noção de JS, mas não sei nenhum framework ainda. Devo aprender algum framework primeiro?

Garanta sua matrícula hoje e ganhe + 2 meses grátis

Continue sua jornada tech com ainda mais tempo para aprender e evoluir

Quero aproveitar agora
4 respostas

Bom dia!

Não sei se entendi muito bem a funcionalidade que você está querendo. Porém, existem quase que infinitas possibilidades dentro do ecossistema javascript para fazer o que você está querendo. Eu aconselharia, você tentar fazer isso com javascript puro mesmo (vanilla), para que você já possa aperfeiçoar mais a linguagem, para ai sim, pensar em pegar algum framework.

Existe uma possibilidade tbm, que é a instalação de plugins de terceiros. Como não entendi muito bem a funcionalidade que você quer, não consigo te recomedar nenhum, tenta fazer uma busca descrevendo o que você quer, mas direcionando para um plugin.

Espero ter ajudado, abraços!

Coloquei uma imagem assim fica mais fácil.

Seria igual o google maps mesmo, porem em outra atividade, o resultado final seria o mesmo.

Tenho uma imagem, nela eu tenho várias imagens. Quando passo o mouse em cima do ponto abre um janela pequena com as informações.

Acho que agr fica mais fácil de entender.

Opa, a imagem não apareceu para mim. Mas ACHO que eu talvez tenha entendido.

Acho que você nem precisa usar o JS para fazer isso, apenas o CSS. Talvez apenas para pegar essas informações, caso elas sejam dinâmicas.

Dá uma olhada nesse pen que eu criei, estão com tamanhos todos fixos, e os apenas html e css, caso seja o que você procure, tente substituir por imagens.

Vê me fala se isso atende o que você precisa. https://codepen.io/JonathanLacerda/pen/dyJgZOe

Com link fica mais fácil a imagem.

https://drive.google.com/file/d/1Ug3sCp4LwqqpVBEZrfiYB3zgEGMvUEdy/view?usp=sharing

É exatamente isso que quero.

Legal vou salvar o seu como exemplo e vou explorar. No futuro compartilho o projeto com você

Obrigadão!!!