Como Fazer Scroll Dentro de um Canvas HTML

A versão 5 da HyperText Markup Language, mais conhecida como "HTML5", inclui suporte para um novo elemento chamado "canvas". Um elemento canvas HTML5 atua como contêiner para animação, gráficos ou código JavaScript personalizado. Se você quiser habilitar rolagem dentro de um canvas na sua página web, pode envolver todo o elemento canvas em um elemento div e usar o atributo overflow para adicionar as barras de rolagem necessárias.

Passo 1

Abra o documento HTML que contém o elemento canvas em um editor web ou processador de texto.

Passo 2

Posicione o cursor de texto antes da tag <canvas> no seu código HTML.

Passo 3

Digite o seguinte no seu código HTML:

<div style="width: 500px; height: 300px; overflow: auto;">

O atributo overflow habilitará barras de rolagem no seu contêiner.

Passo 4

Substitua os atributos width e height pelos valores em pixels que deseja usar para definir o tamanho do contêiner div. Certifique-se de que os valores escolhidos sejam grandes o suficiente para caber todo o tamanho do seu elemento canvas.

Passo 5

Posicione o cursor de texto após a tag </canvas>.

Passo 6

Digite </div> no código HTML para fechar o contêiner div.

Passo 7

Salve o documento HTML e faça upload para seu servidor web para visualizar o elemento canvas com rolagem.

• Como Mudar Vizio para 1080p
• Como Criar Gráfico de Pirâmide no Excel