JavaScript ile Takvim Yapmak
UstaDerslik Soru-Cevap Yararlı Araçlar
arama ikon
Diller
Türkçe Türkçe

bilgi UstaDerslik
Bu uyari kutusudur.
Tamam
Anasayfa
İletişim
Üyeler

JavaScript ile Takvim Yapmak

profil
cArleone
BEĞEN(0)
BEĞENME(0)
GÖRÜNTÜLENME(3159)
RAPOR ET
Bu dersimizde dinamik Türkçe bir takvim yapacağız.Takvimi javascript kullanarak yapacağız.Javascript de tarih ve saat değerlerini alabilmek için.Bir değişken yaratıp buna new Date() diyerek tarih değerlerini taşıyacak diyoruz.Sonra bunları istediğimizi alıyoruz.Şimdi kodlara geçelim.

<!DOCTYPE html>
<html lang="en">
<head>
<title>UstaDerslik</title>
<script type="text/javascript">
var tt=new Date();
//tt adlı bir tarih ve saat değerlerini taşıyacak dedik.
var ay=new Array(12); ay[0]="Ocak";ay[1]="Şubat";ay[2]="Mart";ay[3]="Nisan";ay[4]="Mayıs";ay[5]="Haziran";ay[6]="Temmuz";ay[7]="Ağustos";ay[8]="Eylül";ay[9]="Ekim";ay[10]="Kasım";ay[11]="Aralık";
//ayı alırken sayı olarak alırız.Bizde bir array yarattık.Bu sayıyı array içine alarak türkçe karşılığını alacğız.
var gun=new Array(7); gun[0]="Pazar";gun[1]="Pazartesi";gun[2]="Salı";gun[3]="Çarşamba";gun[4]="Perşembe";gun[5]="Cuma";gun[6]="Cumartesi";
//yukardakinin aynısını gün için yapıyoruz.
</script>
<style type="text/css">
// Sade bir takvim tasarımı
.t_menu{width:200px;height:200px;background:#eb5300;padding:10px;margin:auto;text-align:center;}
.t_gun,.t_tarih{color:#fff;font-size:18px;font-family:"Architects Daughter", cursive;line-height:20px;}
.t_sayi{color:#fff;font-size:130px;font-family:"Architects Daughter", cursive;line-height:150px;}
</style>
</head>
<body>

<div class="t_menu">
<div class="t_gun"><script type="text/javascript">document.write(gun[tt.getDay()])</script></div
<div class="t_sayi"><script type="text/javascript">document.write(tt.getDate())</script></div>
<div class="t_tarih"><script type="text/javascript">document.write(ay[tt.getUTCMonth()])</script> <script type="text/javascript">document.write(tt.getFullYear())</script></div>
</div>
<!-- Yukarda da verilerimi alıp ekrana basıypruz.-->
</body>
</html>


Görüntüsü :
http://ustaderslik.com/resim/ders/tn90l.png
Bu şekilde javascript ile dinamik Türkçe bir takvim yapmış olduk.Hemen takvim yapmak isteyenler için bir araç yaptım kullanabilirsiniz.

http://ustaderslik.com/takvim/



Kod
Kalın
Vurgu
Resim
Video
Url
CEVAPLA
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






Giriş
Şifremi Unuttum...
Şifre Talep
  Kuralları Kabul Ediyorum.
Kaydol