Kuidas teha oma veebisaidile pildi slaidiseanssi (HTML ja JavaScript) Täielik õpetus

Ma tahan saavutada järgmist: Kujutage mustale kirjutuslauale valge paberileht. Seejärel pöörake paberit natuke vasakule (näiteks 25 kraadi). Nüüd on teil endiselt must kirjutuslaud ja peal pööratud valge karp.

Sellesse pööratud valgest kasti tahan paigutada tavalise html-vormingus sisu, nagu tekst, tabelid, div jne.

Mul on juba esimesel sammul probleem: ristküliku pööramine. See on minu kood siiani:

<html> <head> <script> function draw() { var canvas=document.getElementById('myCanvas'); var c=canvas.getContext('2d'); c.fillStyle = '#00'; c.fillRect(100, 100, 100, 100); c.rotate(20); c.fillStyle = '#ff0000'; c.fillRect(150, 150, 10, 10); } </script> </head>   </body> </html> 

Sellega näen ainult tavalist musta kasti. Mitte midagi muud. Eeldan, et ka punane, pööratud kast peaks olema, aga pole midagi.

Milline on parim viis selleni jõudmiseks ja selle veebisaidi (mastaapimise) taustana kasutamiseks?

  • Vastavalt KKK-le kuuluvad disainiküsimused Doctype'i

Näen teie koodil ühte viga:

c.fillStyle = '#00'; 

peaks olema

c.fillStyle = '#000'; 

See peaks aitama. Järgige ka linki, kus on mõned näited selle kohta, mida soovite: https://developer.mozilla.org/en/drawing_graphics_with_canvas

none: Charles Robertson | none

none