HTML5
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


Html5 Canvas Yağmur Efekti Verme
Bu dersimiz de html5 ile yağmur efekti vermeyi göreceğiz.Bunun için [renk=!d12c69!] rainyday.js[/renk] yi kullanacağız.Yağmur efektini Seçtiğimiz bir resimin üzerine uyguluyoruz.Örneği incelerseniz...
  cArleone(HTML5)
HTML5 Svg Türkiye Haritası
Bir projem için interaktif bir Türkiye haritası lazımdı.Biraz arayınca bunu buldum.Plugini optimize ederek en sade ve hızlı haline getirdim.Başkalarının da işine yarar diye paylaşmak ve kullanımını anlatayım dedim...
  cArleone(HTML5)
HTML5 Canvas Ders-26 Metin Genişliklerini Bulmak - measureText
HTML5 canvas derslerimize devam ediyoruz.Bu derste fillText ile ekrana bastığımız metnin genişliğini bulmayı göreceğiz.Bunun için kullanacağımız komut measureText.MeasureText tuvalde belirlediğimiz font tipi,büyüklüğünü vs...
  cArleone(HTML5)
HTML5 Svg Ders-7 Metinler - Text
Html5 svg serimize devam ediyoruz.Bu derste text tagını anlatacağım.Text tagı ile svg içine metin bastırabiliriz.Uzatmadan parametrelerine geçeyim...
  cArleone(HTML5)
HTML5 Svg Ders-6 Devam Eden çizgi - polyline
Html5 svg derslerimize devam ediyoruz.Bu derste polyline tagını işleyeceğiz.Polyline,polygon tagından çok farklı değildir.İşleyişi aynı ama polyline tek farkı sadece kesişen yerlerin içini değil istediğimiz zaman içini boyaya bilmemiz.Parametrelerine göz atalım...
  cArleone(HTML5)
HTML5 Svg Ders-5 çizgi - Line
Html5 svg derslerimize deavm ediyoruz.Bu derste svg de çizgi çizderme komutu olan lineyi işleyeceğiz.İlk derste gördüğümüz polygona biraz benziyor line.Ama polygondaki çizgiler kesişince bir polygon oluşuyordu.Ama linede...
  cArleone(HTML5)
HTML5 Svg Ders-4 Elips - ellipse
Html5 svg derslerimize devam ediyoruz.Bu derste elips çizmemizi sağlan ellipse tagını işleyeceğiz.Geçen derste işlediğimiz daire gibi ama bunda dikey ve yatay yarı çapları kendimiz değiştiriyoruz.Daire olduğu gibi...
  cArleone(HTML5)
HTML5 Svg Ders-3 Daire - circle
Html5 svg derslerimize devam ediyoruz.Bu derste daire çizdirmeyi göreceğiz.Bunun için kullancağımız tag circle .Daireyi çizerken belirttiğim konum...
  cArleone(HTML5)
HTML5 Svg Ders-2 Dikdörtgen - rect
Öncelikle svg den az bahsedeyim.Svg açılımı " [renk=!d12c69!] Scalable Vector Graphics[/renk] " Türkçesi ölçeklenebilir vektör grafikleri.Svg canvas gibi...
  cArleone(HTML5)
HTML5 Sayfalar Arası ileri Geri Butonu Yapma - History
Html5 derslerimize devam ediyoruz.Bu derste sayfalara geri dön butonu yada ileri butonu koymayı nasıl yapacağımızı anlatacağım.Bu tür butonlar normal sitelerde çok işe yaramasalar bile mobil sitelerimizde çok işe yarayan özelliklerdir.Hemen komutları inceleyelim...
  cArleone(HTML5)
HTML5 Canvas Ders-25 clip() Kullanımı
Html5 serimize devam ediyoruz.Bu derste clip() methodunu anlatacağım.Clip kırpma anlamındadır.Canvasta ise yazıldığı yerde altaki tüm objeleri yukardakinin içine sokmasıdır.Yani yukarıdaki objeden taşan kısımları gizler.
  cArleone(HTML5)
HTML5 Canvas Ders-24 save() ve restore() Kullanımı
Html5 eğitimimize devam ediyoruz.Bu derste save() ve restore() methodlarını işleyeceğiz.Save ve restore kayıt et yükle işlemini yapıyor.Kayıt ettikleri şey ise canvasın o anki durumu.Şöyleki canvastaki komutların çoğu alt objeleri de etkiler...
  cArleone(HTML5)
HTML5 Ders-7 Datalist Kullanımı
Html5 derslerimize devam ediyoruz.Bu derste datalist tagını anlatacağım.Datalist oluşturduğumuz inputlara veritabanı niteliğinde select tagı gibi açılan veriler atar.Örneği incelediğinizde daha iyi anlarsınız...
  cArleone(HTML5)
HTML5 Ders-6 Time Etiketi
Html5 canvas dersleri çok fazla olduğu için normal tag anlatımlarına baya ara vermiştim.Canvas hemen hemen bittiği için normal taglara devam ediyoruz.Bu derste time etiketinin kullanımını anlatacağım.Time etiketi işlev...
  cArleone(HTML5)
HTML5 Canvas Ders-23 Mouse Koordinatlarını Alma
Html5 serimize devam ediyoruz.Bu derste mouse koordinatlarını almayı göreceğiz.Koordinatları şu şekilde alacağız.Canvasta mouse hareket etttiğinde mousenin sayfadaki konumunu alıp canvasın sayfadaki konumunda çıkardığımızda mousenin canvas üzerindeki koordinatını bulmuş oluruz...
  cArleone(HTML5)
HTML5 Canvas Ders-22 Olay Yakalayıcı - addEventListener
Html5 derslerimize devam ediyoruz.Bu derste event yani olay yakalayıcı olan addEventListener fonksiyonunu işliyeceğiz.Öncelikle ne tür olayları yakalıyor ona bakalım.Mouse hareket,tıkla,klavye tıklamaları,form etkileşimleri,yüklenme,değişim gibi bir çok eventı içinde barındırıyor.Bu derste hepsini ...
  cArleone(HTML5)
HTML5 Server-Sent Events Kullanımı - SSE
Bu dersimizde html5 in sse özelliğini yani Server-Sent Events özelliğini anlatacağım.Sse ajax gibidir belirlediğimiz yerden veri çekeriz.Bunun farkı ise bağlantıyı kurduktan sonra belirli aralıklarla bendi otomatik çeker.Veri çekim sıklığı 5-10 saniye kadar...
  cArleone(HTML5)
HTML5 Canvas Ders-21 Eğri çizmek - bezierCurveTo()
Html5 canvas serimize devam ediyoruz.Bu derste bezierCurveTo() kullanımını anlatacağım.BezierCurveTo eğri çizmemizi sağlıyor...
  cArleone(HTML5)
HTML5 Canvas Ders-20 Animasyon yapımı
HTML5 canvas derslerimize devam ediyoruz.Bu derste animasyon yapmayı anlatacağım.Bunun için kullanacağımız komutlardan biri [renk=!d12c69!] clearRect()[/renk] .ClearRect belirlediğimiz konumda belirlediğimiz bir alandaki tüm objeleri...
  cArleone(HTML5)
HTML5 Canvas Ders-19 Canvası Resim Olarak Kaydetme - toDataURL()
HTML5 canvas serimize devam ediyoruz.Bu derste [b]toDataURL()[/b] komutunu anlatacağım.ToDataURL canvastaki bulunan herşeyi tek bir resim haline getirip,resmin urlsini bize sunuyor.Geçen derste gösterdiğimiz resim rengi değiştirmeyide kullanarak bir örnek yaptım.ToDataURL bize verdiği...
  cArleone(HTML5)
HTML5 Canvas Ders-18 Resim Renklerni Değiştirme - putImageData()
HTML5 canvas derslerimize devam ediyoruz.Bu derste resmin renkleriyle oynamayı göstereceğim.Geçen derste [renk=!d12c69!] getImageData[/renk] 'yla resmin verilerini çekmiştik.GetImageData resmin her pixelin verisini veriyordu.Bu verileri ...
  cArleone(HTML5)
HTML5 Canvas Ders-17 Resim Bilgilerini Alma - getImageData()
HTML5 canvas derslerimize devam ediyoruz.Bu derste [b]getImageData()[/b] fonksiyonunu anlatacağım.GetImageData belirlediğimiz alan içindeki resimlere ait 4 bilgiyi pixele göre alıp bize verir.Bu veriler rgb ye ait olan [renk=!d12c69!] red,green,blue[/renk] verileri.Bunların dışında birde [renk=!d12c69!] alpha[/renk] değerini verir.Örnek...
  cArleone(HTML5)
HTML5 Svg Kullanımı
Bu dersimizde html5 in svg özelliğini anlatacağım.Svg canvas gibi bize bir çizim alanı sunuyor.Bu çizim alanında polygonlarla çizim yapabiliyoruz.Basit bir örnekle başlayalım...
  cArleone(HTML5)
HTML5 Canvas Ders-16 GlobalAlpha Kullanımı
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...
  cArleone(HTML5)
HTML5 Canvas Ders-15 Shadow Kullanımı
Html5 derslerimize devam ediyoruz.Bu derste objelere ve metinlere gölge vermeyi göreceğiz.Öncelikle kullanacağımız kodları açıklayarak başlayalım...
  cArleone(HTML5)
HTML5 Audio Analyser Yapımı
Bu dersimizde html5 ile audiolar için analyser yapacağız.Analyser ne diye sorarsanız,müziğin ritmine göre hareket eden barlar.Yapacağımız analyser sadece webkit tarayıcılar için.Yani chrome,yandex,safari için...
  cArleone(HTML5)
HTML5 Canvas Ders-14 rotate() Kullanımı
HTML5 canvas derslerimize devam ediyoruz.Bu derste rotate() fonksiyonumuzu işleyeceğiz.İşlevinden başlayalım.Rotote ile canvas yani tuvalimizi döndürüyoruz.Aşağıda örnek ...
  cArleone(HTML5)
HTML5 Canvas Ders-13 scale() Kullanımı
HTML5 derslerimize devam ediyoruz.Bu derste scale() kodunu işleyeceğiz.Öncelikle işlevinden başlayalım.Tuvalimize bir çeşit zoom yani büyültme veya küçültme işlevindedir.Biraz sonra...
  cArleone(HTML5)
HTML5 Sürükle ve Bırak Kullanımı
HTML5 derslerimize devam ediyoruz.Bu derste drag and drop yani sürükle ve bırak özelliğini işleyeceğiz.Html5 ile gelen yeni parametrelerle sürüklemyi açma,sürüklemenin başlama veya bitme,üzerine vs gibi anları yakalamamıza yarıyor.
  cArleone(HTML5)
HTML5 Canvas Ders-12 translate() Kullanımı
HTML5 canvas derslerimize devam ediyoruz.Bu derste translate fonksiyonunu işleyeceğiz.Öncelikle işlevinden başlayayım.Translate canvas içindeki çizim başlama alanını değiştirmemize yarar.Resimli anlatayım daha iyi anlarsınız...
  cArleone(HTML5)
HTML5 Canvas Ders-11 Metin işlemleri
HTML5 derslerimize devam ediyoruz.Bu derste metin işlemlerini göreceğiz.Hemen kodlara geçelim.İlk önce sayfamıza tuvalimizi koyalım...
  cArleone(HTML5)
HTML5 Canvas Ders-10 Radial Gradient Yapımı
HTML5 derslerimize devam ediyoruz.Bu derste radial gradient işlemini göreceğiz.Geçen derste linear gradienti işemiştik.linear düz bir geçiş yapıyordu.Bu ise çember şeklinde renk geçişi yapıyor...
  cArleone(HTML5)
HTML5 Canvas Ders-9 Linear Gradient Yapımı
HTML5 canvas derslerimize devam ediyoruz.Bu derste linear gradienti işleyeceğiz.Linear gradient renk geçişlerini sağlamaktadır.Şimdi kodumuzu inceleyelim....
  cArleone(HTML5)
HTML5 Video Player örneğim
Bu gün boş bir vaktimde html5 ile video player yapayım dedim.Bir şeyler yaptım az çok bir şeye benzedi paylaşmak istedim.Çok güzel olmadı ama incelemek isteyen olur diye paylaşmak istedim...
  cArleone(HTML5)
HTML5 Cix Audio Player örneğim
Daha önceden kodladığım audio playerı paylaşmak istedim.Aşağıdan indirebilirsiniz.Sitelerinizde kullanabilirsiniz...
  cArleone(HTML5)
HTML5 Audio Player Yapımı
Bu dersimizde html5 kullanarak audio-playeri nasıl yönetiriz onu göstreceğim.Hemen kodlarımıza geçelim...
  cArleone(HTML5)
HTML5 Canvas Ders-8 Arkaplan Rengi (fillStyle-fill)
HTML5 serimize devam ediyoruz.Bu derste yaptığımız çizimlere arkaplan rengi vermeyi göreceğiz.Arka plan rengi seçmeyifillStyle ve boyamayı
  cArleone(HTML5)
HTML5 Canvas Ders-7 Sayfaya Resim Eklemek (drawImage)
HTML5 serimize devam ediyoruz.Bu derste tuvalimize resim eklemeyi göreceğiz.Resim eklemeyi drawImage() koduyla yapıyoruz.Şimdi kodlara geçelim.
  cArleone(HTML5)
HTML5 Canvas Ders-6 Daire Yapımı
HTML5 serimize devam ediyoruz.Bu derste daire çizmeyi göreceğiz.Geçen ders arc ile bir yarıçap belirleyip yay yapıyoduk.Yay başlama ve bitiş ucunu birleştirirsek bir daire oluyo...
  cArleone(HTML5)
HTML5 Canvas Ders-5 Yay çizmek (Arc)
HTML5 eğitim serimize devam ediyoruz.Bu derste yay yapımını göreceğiz...
  cArleone(HTML5)
HTML5 Canvas Ders-4 Dikdörtgen Yapımı
HTML5 canvas serimize devam ediyoruz.Bu derste dikdörtgen yapacağız...
  cArleone(HTML5)
HTML5 Canvas Ders-3 çizgi Stili
HTML5 canvas eğitim setimize devam ediyoruz.Bu derste çizginin stilini değiştirecez.Yani kalınlığını,rengini,ovalliğini ayarlayacaz...
  cArleone(HTML5)
HTML5 Canvas Ders-2 çizgi çizmek (lineTo)
HTML5 canvas serimize devam ediyoruz.Bu derste artık tuvalimize bir şeyler çizmeye başlayacaz. İlk olarak...
  cArleone(HTML5)
HTML5 Canvas Ders-1 Giriş
HTML5le gelen canvas tagını anlatmaya başlayacam.Öncelikle canvas ne onla başlayalım. Canvas tuval demek...
  cArleone(HTML5)
Gamemaker HTML5 Ders-12 İf-Else
Gamemaker serimize devam ediyoruz.Bu dersimizde gene çok kullanacağımız bir döngüyü görecez.Bu ...
  cArleone(GAMEMAKER)
Gamemaker HTML5 Ders-11 Global Değişkenler
Bu dersimizde önemli olan bir alanı işliyecez.Global değişkenleri. Öncelikle değişken ile global arasındaki farka bakalım...
  cArleone(GAMEMAKER)
Gamemaker HTML5 Ders-10 Array (Diziler)
Gamemaker eğitim serimizin bu bölümünde array yani dizilere göz atacaz. Bir önceki derste değişkenlere göz atmıştık.Bu derste tek isim altında ...
  cArleone(GAMEMAKER)
Gamemaker HTML5 Ders-9 Değişkenler
Gamemaker eğitim serimizde kodlara giriş yapıyoruz artık.İlk önce değişkenlerden başlıyoruz.Bir oyun tasarlarken değişkenler çok önemlidir.Çünkü ...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-8 Room (Odalar)
Gamemaker serimize devam ediyoruz bu derste room yani odaları işliyecez.Roomların işlevinden başlayalım.Objects bölümünden resimlerimiz akıllandırıp ayarlarımızı oluşturacağımız objelerimizi yaptıkmı.Bu objeleri burda odaya koyarak haritalarımızı ...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-7 Objects
Geldik en önemli dersimize.Bu derste objects bölümünü işliyecez.Objects Bölümünde diğer derste yarratığımız font resim müzikleri kullanacağımız...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-6 Fonts
Gamemaker eğitim serimize devam ediyoruz bu derste font ları işliyecez...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-5 Paths (Yol)
Bu derste gamemaker eğitim serimizin 5 bölümünü yapacaz.Bu derste path yani yol u işleyecez.Bu bölünde çizilen ...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-4 Background (Arkaplan  Resmi)
Gememaker eğitim setimize devam ediyoruz.Bu derste background yani arkaplan bölümünü görecez.Bu kısımda ...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-3 Sound (Müzik)
Gememaker eğitim setimize devam ediyoruz.Bu derste sound yani...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-2 Sprites (Resim)
Gememaker eğitim setimizin 2 bölümünde sprite bölümü var.Burdan oyunumuzda kullanacağımız tüm...
  cArleone(GAMEMAKER)
GameMaker HTML5 Ders-1 Giriş
Gamemaker ile oyun yaptığım zamanlar bu eğitim setini hazırlamıştım.Önce gamemakerı az tanıtayım.Gamemaker bir oyun yapma programıdır.Genellikle 2d ...
  cArleone(GAMEMAKER)
HTML5 istatislik Grafiği Yapımı
HTML5 ile daha önceden yaptığım bir istatistlik grafiği örneğini paylaşacam....
  cArleone(HTML5)
HTML5 Genel Site şablonu
Bu dersimizde size html5 in yeni genel site şablonunu anlatacam. Öncelikle görsel...
  cArleone(HTML5)
HTML5 Ders-5 Audio - Source Etiketleri
HTML5 de tagların anlatmaya devam ediyoruz yeni tagımız audio.Bu tag sayesinde sayfamıza...
  cArleone(HTML5)
HTML5 Ders-4 Video - Source Etiketleri
HTML5 in video tagını anlatacam bu derste.Adı üzerin de video sayfaya videomuzu...
  cArleone(HTML5)
HTML5 Ders-3 Meter Etiketi
Bu dersimizde meter tagını işleyecez.Bu can barı gibi ilerleme çubuğu.Daha önce jquery ui nin pluginin de buna benzer anlatmıştım onu kullanmak için dosya çağırıyoduk sayfamıza ama html5...
  cArleone(HTML5)
HTML5 Ders-2 Details - Summary Etiketleri
Bu dersimizde html5 de details tagı ve onun bir alt tagı olan summary tagını görecez. Öncelikle details...
  cArleone(HTML5)
HTML5 Ders-1 iskelet ve Gelen - Giden Etiketler
HTML5 derslerine başlıyoruz.HTML5 web için bir çok yenilik getiren html nin yeni versiyonudur.Daha tamamlanmamıştır ve tarayıcılarda tam olrak çalışmamaktadır. safari+chrome şuan...
  cArleone(HTML5)

Önerilen Yazarlar
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






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