Linggafiles: JavaScript

Showing posts with label JavaScript. Show all posts

Monday, 10 March 2014

JavaScript Kalender Standar

Membuat Kalender Standar dengan JavaScript tampilan standar :

gambar kalender Standar JavaScript by Lingga

ScriptKu :

<html>
<head>
<title>kalender</title>
<style type="text/css">

</style>
<body>
<head>
<div id="kal">
<script type="text/javascript" language="javascript">
function calendar() {
var date = new Date();
var day = date.getDate();
var month = date.getMonth();
var year = date.getFullYear();

var months = new Array('Januari','Februari','Maret','April','Mei','Juni','Juli','Agustus','September','Oktober','November','Desember');
var monthDays = new Array(31,28,31,30,31,30,31,31,30,31,30,31);
var weekDay = new Array('<font color="red">Sun</font>', 'Mon</font>', 'Tue</font>', 'Wed</font>', 'Thu</font>', 'Fri</font>', 'Sat</font>');
var days_in_this_month = monthDays[month];

var calendar_html = '<table cellspacing=0 class="calendarTable">';
calendar_html += '<tr><td width="" class="monthHead" colspan="7" align="center" bgcolor=blue><font color="white">' + months[month] + ' ' + year + '</td></tr>';
calendar_html += '<tr>';
var first_week_day = new Date(year, month, 1).getDay();
for(week_day= 0; week_day < 7; week_day++) {
calendar_html += '<td class="weekDay" bgcolor=#1179c8 height="26"><font color="white">' + weekDay[week_day] + '</td>';
}
calendar_html += '</tr><tr>';

for(week_day = 0; week_day < first_week_day; week_day++) {
calendar_html += '<td background="btk.png"> </td>';
}
week_day = first_week_day;
for(day_counter = 1; day_counter <= days_in_this_month; day_counter++) {
week_day %= 7;
if(week_day == 0)
calendar_html += '</tr><tr>';

if(day == day_counter) {
calendar_html += '<td class="currentDay" align="center" bgcolor=blue><font color="white">' + day_counter + '</font></td>';
} else {
calendar_html += '<td class="monthDay" align="center" background=btk.png width="" height="26"> ' + day_counter + ' </td>';
}
week_day++;
}
calendar_html += ' <td background="btk.png"> </tr>';
calendar_html += ' </table>';

document.write(calendar_html);
}
</script>
</head>
<body> <center>
<script type="text/javascript">calendar();</script> </center>
</div>
</body>
</html

jika ada masalah tinggal Comment..

JavaScript Kalender biasa

Membuat Kalender biasa dengan JavaScript tampilan biasa tidak wow,, by Lingga:

Gambar kalender biasa JavaScript by Lingga

<html>
<head><title>kalender</title></head>
<body>
<div id="kal">
<script language='javascript' type='text/javascript'>
var fifteenth = new Array('<font color="red">Sun</font>', '<font color="white">Mon</font>', '<font color="white">Tue</font>', '<font color="white">Wed</font>', '<font color="white">Thu</font>', '<font color="white">Fri</font>', '<font color="white">Sat</font>');
var sixteenth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var seventeenth = new Date();
var eighteenth = seventeenth.getMonth();
var nineteenth = seventeenth.getDay();
var first2 = seventeenth.getDate();
var second2 = sixteenth[eighteenth];
if (eighteenth == 1) { var third2 = seventeenth.getYear();
if (third2%4 == 0) second2 = 29;}
document.write("<table border='1' bgcolor='#90c0f0' cellspacing='0.1' cellpadding='2'>");document.write('<tr>');
for (var fourth2=0; fourth2<7; fourth2++) {
document.write("<td width='30' height='30' bgcolor=blue background=image/bk.png>");
document.write("<div align='center'>" + fifteenth[fourth2] + "</div>");
document.write('</td>');}
document.write('</tr>');
var fifth2 = 0;
var sixth2 = 1;
var fifteenth3 = nineteenth - first2%7 + 1;
if (fifteenth3 < 0) fifteenth3 += 7;
var sixteenth3 = parseInt((fifteenth3 + second2)/7);
if ((fifteenth3 + second2)%7 != 0) sixteenth3++;
for (var fourth2=sixteenth3; fourth2>0; fourth2--) {
document.write('<tr>');
for (var seventeenth3=7; seventeenth3>0; seventeenth3--) {
document.write('<td bgcolor=#0d78e6 background=image/btk.png>');
if (fifth2<fifteenth3 || sixth2>second2) {
document.write("<div align='center'></div>"); fifth2++; }
else {
if (sixth2 == first2)
document.write("<div align='center'><font color='white'>[" + sixth2 + "]</font></div>");
else document.write("<div align='center'><font color='white'>" + sixth2 + "</font></div>"); sixth2++; }
document.write('</td>') }
document.write('</tr>');}
document.write('</table>');
</script>
</div>
</body>
</html>

jika ada masalah tinggal Comment..

JavaScript Jam Digital

Membuat Jam Digital Dengan menggunakan JavaScript :

<html>
<head><title>jam</title>
<style type="text/css">

</style>
</head>
<body>
<div id="jam">
<script language="javascript">
function jam(){
var waktu = new Date();
var jam = waktu.getHours();
var menit = waktu.getMinutes();
var detik = waktu.getSeconds();

if (jam < 10){
jam = "0" + jam;
}
if (menit < 10){
menit = "0" + menit;
}
if (detik < 10){
detik = "0" + detik;
}
var jam_div = document.getElementById('jam');
jam_div.innerHTML = jam + ":" + menit + ":" + detik;
setTimeout("jam()", 1000);
}
jam();
</script>
</div>
</body>
</html>

jika ada masalah tinggal Comment..

JavaScript Jam Analog

Membuat Jam Analog dengan menggunakan JavaScript:

<html> <head> <title>Jam Analog</title>
<script type="text/javascript" src="excanvas.js"></script>
</head>
<body>
<canvas id="clock" width="100" height="100"></canvas>
<script type="text/javascript">
window.onload = function()
{
function draw()
{
var ctx = document.getElementById('clock').getContext('2d');
ctx.strokeStyle = "rgba(0, 0, 0, 1)";
ctx.clearRect(0, 0, 100, 100);
ctx.beginPath();
ctx.lineWidth = 1;
ctx.arc(50, 50, 48, 0, Math.PI * 2, true);
ctx.stroke();
var i; for(i=0; i < 360; i+=6)
{
ctx.lineWidth = ((i % 30)==0)?3:1;
ctx.strokeStyle = ((i % 30)==0)?"green":"blue";
var r = i * Math.PI / 180;
ctx.beginPath();
ctx.moveTo(50+(45 * Math.sin(r)), 50+(45 * Math.cos(r)));
ctx.lineTo(50+((((i % 30)==0)?37:40) * Math.sin(r)),
50+((((i % 30)==0)?37:40) * Math.cos(r)));
ctx.closePath();
ctx.stroke();
}
ctx.strokeStyle = "rgba(32, 32, 32, 0.6)";
// hour
var d = new Date();
var h = (d.getHours() % 12) + (d.getMinutes() / 60);
ctx.strokeStyle = "purple";
ctx.lineWidth = 4;
ctx.beginPath();
ctx.moveTo(50+(25 * Math.sin(h * 30 * Math.PI / 180)),
50+(-25 * Math.cos(h * 30 * Math.PI / 180)));
ctx.lineTo(50+(5 * Math.sin((h+6) * 30 * Math.PI / 180)),
50+(-5 * Math.cos((h+6) * 30 * Math.PI / 180)));
ctx.closePath(); ctx.stroke();
//minute
var m = d.getMinutes() + (d.getSeconds() / 60);
ctx.strokeStyle = "purple";
ctx.lineWidth = 2;
ctx.beginPath();
ctx.moveTo(50+(38 * Math.sin(m * 6 * Math.PI / 180)),
50+(-38 * Math.cos(m * 6 * Math.PI / 180)));
ctx.lineTo(50+(3 * Math.sin((m+30) * 6 * Math.PI / 180)),
50+(-3 * Math.cos((m+30) * 6 * Math.PI / 180)));
ctx.closePath();
ctx.stroke();
//second
var s = d.getSeconds() + (d.getMilliseconds() / 1000);
ctx.strokeStyle = "red";
ctx.lineWidth = 1;
ctx.beginPath();
ctx.moveTo(50+(45 * Math.sin(s * 6 * Math.PI / 180)),
50+(-45 * Math.cos(s * 6 * Math.PI / 180)));
ctx.lineTo(50+(10 * Math.sin((s+30) * 6 * Math.PI / 180)),
50+(-10 * Math.cos((s+30) * 6 * Math.PI / 180)));
ctx.closePath(); ctx.stroke(); } setInterval(draw, 100); }
</script> </body> </html>

jika ada masalah tinggal Comment..

JavaScript Kalender page

Membuat Kalender berisi fungsinya dapat memilih bulan tahun page nya dengan JavaScript by: Lingga :

gambar kalender JavaScript by Lingga

Scriptku :

<html>
<head>
<title></title>
</head>
<body>

<HEAD>

<style type="text/css">

</style>

<script type="text/javascript">




</script>

</HEAD>



<BODY>

<script type="text/javascript">writeCalendar()</script>



</body>
</html>

jika ada masalah tinggal Comment..