Hello,
Could you please help me with my code
At the beginning: I insert an image into table and view in browser >> I found that there are a line under this iamage then I use allign="middle" and I work.
But when I draw a canvas, i cannot put allign = "middle" into the script to remove the line under image. Could you help me please?
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="Text-CSS/main.css">
<script>
function init() {
setImageOne();
}
function setImageOne() { setImage('Images/Home_Icon.jpg'); }
function setImageTwo() { setImage('Images/Home_Icon_Over.jpg'); }
function setImage(src) {
var canvas = document.getElementById("e");
var context = canvas.getContext("2d");
if (context == null) return;
var img = new Image();
img.src = src;
context.drawImage(img, 0, 0, 35, 44);
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body {
background-color: #999;
}
</style>
</head>
<body onLoad="init()">
<div>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="BG_Top_BN">
<tr>
<th scope="col">
<canvas id="e" width="35" height="44" onMouseOver="setImageTwo()" onMouseOut="setImageOne()" align="center">
<p>No Canvas Support in Browser</p>
</canvas>
</th>
</tr>
</table>
</div>
</body>
</html>
Could you please help me with my code
At the beginning: I insert an image into table and view in browser >> I found that there are a line under this iamage then I use allign="middle" and I work.
But when I draw a canvas, i cannot put allign = "middle" into the script to remove the line under image. Could you help me please?
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="Text-CSS/main.css">
<script>
function init() {
setImageOne();
}
function setImageOne() { setImage('Images/Home_Icon.jpg'); }
function setImageTwo() { setImage('Images/Home_Icon_Over.jpg'); }
function setImage(src) {
var canvas = document.getElementById("e");
var context = canvas.getContext("2d");
if (context == null) return;
var img = new Image();
img.src = src;
context.drawImage(img, 0, 0, 35, 44);
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body {
background-color: #999;
}
</style>
</head>
<body onLoad="init()">
<div>
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="BG_Top_BN">
<tr>
<th scope="col">
<canvas id="e" width="35" height="44" onMouseOver="setImageTwo()" onMouseOut="setImageOne()" align="center">
<p>No Canvas Support in Browser</p>
</canvas>
</th>
</tr>
</table>
</div>
</body>
</html>