Mina SVG

Xiii, seu navegador não sabe ler SVG


Feito com HTML, CSS, SVG e Javascript. Detecta morte e vitória.

Tanto o tabuleiro quanto a linha de status são um gráfico vetorial em XML (padrão SVG). São 16 elementos <rect> e 17 <text> (casas + status). As casas são definidas e posicionadas estaticamente (eixos X e Y) no XML, sem cores. Há regras CSS que cuidam da aparência, pintando as casas e o texto. No Javascript as casas recebem o atributo onClick. Cada elemento text recebe seu conteúdo (os números e bombas) segundo um array.

O HTML é meramente cosmético, pois tanto o CSS quanto o Javascript estão dentro do arquivo SVG, que é autosuficiente.

Fontes: mina-svg.html mina.svg




Camino . Firefox . Opera . IE . Safari