Commit 1614e8fe authored by colmoneill's avatar colmoneill
Browse files

few further elements for practical 4 task 2

parent 1c36a1de
......@@ -10,3 +10,27 @@ canvas {
img{
visibility: hidden;
}
section.full{
width: 100%;
outline: 1px solid green;
margin: 0;
padding: 0;
}
section.half{
width: 50%;
float: left;
outline: 1px solid orange;
margin: 0;
padding: 0;
}
@media only screen and (max-width: 600px) {
body {
background-color: lightblue;
}
section.half{
width: 100%;
}
}
......@@ -25,6 +25,10 @@ function pageLoaded() {
context.beginPath();
context.arc(300,200,40,0,Math.PI,true);
context.stroke();
//colored stroked rect
context.strokeStyle = "#FF0000";
context.strokeRect(20, 20, 150, 100);
// Text
context.font = "10px";
......@@ -34,6 +38,14 @@ function pageLoaded() {
var image = document.getElementById("image");
context.drawImage(image, 100, 100, 300, 300);
var newImg = new Image();
newImg.src = "assets/img/tesse.gif"
newImg.onload = function () {
// Draw image
context.drawImage(newImg, 300, 300, 50, 50);
}
}
pageLoaded();
\ No newline at end of file
......@@ -17,6 +17,19 @@
</canvas>
</section>
<section class="full">
<p>full-width elem</p>
</section>
<section class="half">
<p>half-width elem</p>
</section>
<section class="half">
<p>half-width elem</p>
</section>
<img id="image" src="assets/img/tesseract.gif" alt="">
<script type="text/javascript" src="assets/js/script.js"></script>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment