HTML5 derslerimize devam ediyoruz.Bu derste objenin opaklığını azaltan
globalAlpha kodunu işleyeceğiz.GlobalAlpha uygulandıktan sonra kendinden sonra gelen tüm objelere etki eder.Etkisini kapatmak için 1 değeri vererek yapabilirsiniz.Şimdi bir örnek yapalım.
Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>UstaDerslik</title>
<style type="text/css">
#canvas{border:2px solid #333;}
</style>
</head>
<body>
<canvas id="canvas" width="600" height="200"></canvas>
<script type="text/javascript">
var canvas = document.getElementById('canvas');
var cizim = canvas.getContext('2d');
cizim.beginPath();
cizim.arc(275,100, 50,0,7,false);
cizim.fillStyle = 'red';
cizim.fill();
cizim.globalAlpha=0.3;
cizim.beginPath();
cizim.arc(225,100, 50,0,7,false);
cizim.fillStyle = '#000';
cizim.fill();
</script>
</body>
</html>
Görüntüsü :
Ne yaptık ona bakalım.Öncelikle sayfaya 2 tane daire çizdirttik.Sonra siyah olan objeden önce
cizim.globalAlpha=0.3;
yazarak siyah olan dairenin opaklığını düşürdük.Sonuç bu şekilde oldu.Ama alta başka objeler çizdirirsek onlarada etki edecektir.Siyah daireden hemen sonra
cizim.globalAlpha=1
yazarak normal hale getirebilirsiniz.GlobalAlpha 0-1 arası değer alıyor.1 normal hali oluyor
UstaDerslik
