HTML and CSS Reference
In-Depth Information
position: absolute;
top: 20px;
left: 0px;
width: 300px;
height: 250px;
border: 1px solid #000;
}
.percent {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
}
button {
position: absolute;
top: 300px;
width: 200px;
height: 50px;
visibility: hidden;
}
</style>
<head>
<meta charset=utf-8>
<body>
<div class="percent">Loader: 0%</div>
<canvas width=300 height=250>
<p>No Canvas Support</p>
</canvas>
<button></button>
<script>
function adInit(event) {
event.preventDefault();
var canvas = document.getElementsByTagName('canvas')[0],
context = canvas.getContext('2d'),
progress = document.querySelector('.percent'),
img = document.createElement("img"),
saveBtn = document.querySelector("button"),
mouseIsDown = false,
hasText = true,
clearCanvas = function () {
if (hasText) {
context.clearRect(0, 0, canvas.width, canvas.height);
hasText = false;
}
};
// GENERIC CTA
context.fillText("Drop an image onto the ad!", 50, 50);
