pre class javascript style font-family monospace span style color 3399

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<pre class="javascript" style="font-family:monospace;"><span style="color: #339933;">&lt;!</span>DOCTYPE html<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>html<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>head<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>style type<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;text/css&quot;</span><span style="color: #339933;">&gt;</span>
#body<span style="color: #009900;">&#123;</span>transform<span style="color: #339933;">:</span>scale<span style="color: #009900;">&#40;</span><span style="color: #CC0000;">0.1</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span>
<span style="color: #339933;">&lt;/</span>style<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;/</span>head<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>body<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>canvas id<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;c&quot;</span><span style="color: #339933;">&gt;&lt;/</span>canvas<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>img id<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;i&quot;</span> src<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;image.jpg&quot;</span><span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>img id<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;test&quot;</span><span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;</span>script defer<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;defer&quot;</span><span style="color: #339933;">&gt;</span>
<span style="color: #000066; font-weight: bold;">var</span> c<span style="color: #339933;">=</span>document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;c&quot;</span><span style="color: #009900;">&#41;</span>
<span style="color: #000066; font-weight: bold;">var</span> ctx<span style="color: #339933;">=</span>c.<span style="color: #660066;">getContext</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;2d&quot;</span><span style="color: #009900;">&#41;</span>
&nbsp;
<span style="color: #000066; font-weight: bold;">var</span> i<span style="color: #339933;">=</span>document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;i&quot;</span><span style="color: #009900;">&#41;</span>
i.<span style="color: #660066;">onload</span><span style="color: #339933;">=</span><span style="color: #000066; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
c.<span style="color: #660066;">width</span><span style="color: #339933;">=</span>i.<span style="color: #660066;">width</span><span style="color: #339933;">/</span><span style="color: #CC0000;">10</span>
c.<span style="color: #660066;">height</span><span style="color: #339933;">=</span>i.<span style="color: #660066;">height</span><span style="color: #339933;">/</span><span style="color: #CC0000;">10</span>
ctx.<span style="color: #660066;">drawImage</span><span style="color: #009900;">&#40;</span>i<span style="color: #339933;">,</span><span style="color: #CC0000;">0</span><span style="color: #339933;">,</span><span style="color: #CC0000;">0</span><span style="color: #339933;">,</span>c.<span style="color: #660066;">width</span><span style="color: #339933;">,</span>c.<span style="color: #660066;">height</span><span style="color: #009900;">&#41;</span>
<span style="color: #000066; font-weight: bold;">var</span> test<span style="color: #339933;">=</span>document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;test&quot;</span><span style="color: #009900;">&#41;</span>
test.<span style="color: #660066;">src</span><span style="color: #339933;">=</span>c.<span style="color: #660066;">toDataURL</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;image/jpeg&quot;</span><span style="color: #009900;">&#41;</span>
alert<span style="color: #009900;">&#40;</span>test.<span style="color: #660066;">src</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #339933;">&lt;/</span>script<span style="color: #339933;">&gt;</span>
&nbsp;
<span style="color: #339933;">&lt;/</span>body<span style="color: #339933;">&gt;</span>
<span style="color: #339933;">&lt;/</span>html<span style="color: #339933;">&gt;</span></pre>