Ajax Loader
×
HTML 
 
1
 
2
<!DOCTYPE html>
3
<html>
4
<head>
5
    <meta charset="utf-8">
6
    <title>Stylization</title>
7
</head>
8
<body>
9
<canvas id="canvas" width="6000" height="4000"></canvas>
10
 
11
<script>
12
    var canvas = document.getElementById('canvas');
13
    var ctx = canvas.getContext("2d");
14
 
15
    var gradient = ctx.createLinearGradient(0, 100, 0, 200);
16
    gradient.addColorStop(0.0, 'rgba(0, 0, 255, 1)');
17
    gradient.addColorStop(0.3, 'rgba(128, 0, 255, 0.6)');
18
    gradient.addColorStop(0.6, 'rgba(0, 0, 255, 0.4)');
19
    gradient.addColorStop(1.0, 'rgba(0, 255, 0, 0.2)');
20
 
21
    ctx.fillStyle = gradient;
22
 
23
    ctx.font = "italic 30pt Arial";
24
    ctx.fillText("Выполнил Вакуленко Виктор", 200, 180);
25
    ctx.font = 'bold 30px sans-serif';
26
 
27
    ctx.strokeStyle = "#F00";
28
    ctx.save();
29
    ctx.shadowColor = "#F00";
30
    ctx.shadowOffsetX = 5;
31
    ctx.shadowOffsetY = 5;
32
    ctx.shadowBlur = 5;
33
    ctx.strokeText("Лабораторная работа", 200, 130);
34
    ctx.restore();
35
 
36
    var img = document.createElement('img');
37
      img.onload = function () {
38
            ctx.fillStyle = ctx.createPattern(img, 'repeat');
39
            ctx.font = 'bold 50px sans-serif';
40
            ctx.fillText("ЛНУ имени Тараса Шевченка", 200, 80);
41
      };
42
    img.src = 'http://img0.liveinternet.ru/images/attach/c/5/86/357/86357092_4581.jpg';
43
</script>
44
</body>
45
</html>
 

Лфбораторная 17

CSSDeck G+