Jquery

Tetris Oyununu Javascript Dilini Kullanarak Web Sayfasında Kodlama8

İkinci şeklimiz mavi renkli olan sağa merdiven basamaklı olan şekildir Bu şeklimizde iki durumda döndürülmektedir. sekilNo değişkenimizin değeri 2 olduğunda bu şekil ile ilgili döndürme işlemi yapılacaktır. Bu şeklin dönme işlemini gerçekelştirelim.

Adım 1: Şeklimize ait durum değişkeninin 1 olması durumunu kontrol edelim.

            case 2:
                if (durum == 1) {
 
                }
                break;
Adım 2: Öncelikle şeklin başlangıçta dönme konumunda olup olmadığını kontrol edelim.
            case 2:
                if (durum == 1) {
                    if (aktifSekil[2] > 10) {
 
                    }
                }
                break;
Adım 3: Şeklimizin bir önceki ve bir sonraki şekle göre durumunu kontrol edelim.
            case 2:
                if (durum == 1) {
                    if (aktifSekil[2] > 10) {
                        if ($('#kare' + (aktifSekil[2] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] + 10)).is(":visible") == false) {
 
                        }
                    }
                }
                break;
Adım 4: Kontrol işlemi doğru sonucu bulduğunda şeklimizi gizleyelim ve yeni şeklin konumunu belirleyelim.
            case 2:
                if (durum == 1) {
                    if (aktifSekil[2] > 10) {
                        if ($('#kare' + (aktifSekil[2] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] + 10)).is(":visible") == false) {
                            for (var i = 0; i < 4; i++) {
                                $('#kare' + aktifSekil[i]).css('display', 'none');
                            }
                            aktifSekil[0] = aktifSekil[2];
                            aktifSekil[1] = aktifSekil[0] - 10;
                            aktifSekil[2] = aktifSekil[3] + 10;
                            aktifSekil[3] = aktifSekil[2] - 10;
                            durum = 2;
                        }
                    }
                }
                break;
Adım 5: Şimdi durum değerinin 2 olması halini kontrol edelim.
            case 2:
                if (durum == 1) {
                    if (aktifSekil[2] > 10) {
                        if ($('#kare' + (aktifSekil[2] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] + 10)).is(":visible") == false) {
                            for (var i = 0; i < 4; i++) {
                                $('#kare' + aktifSekil[i]).css('display', 'none');
                            }
                            aktifSekil[0] = aktifSekil[2];
                            aktifSekil[1] = aktifSekil[0] - 10;
                            aktifSekil[2] = aktifSekil[3] + 10;
                            aktifSekil[3] = aktifSekil[2] - 10;
                            durum = 2;
                        }
                    }
                } else if (durum == 2) {
 
                }
                break;
Adım 6: Şeklimizin önceki ve sonraki konumunu kontrol edelim. Ayrıca şeklin duvarlara yanaşık olup olmadığını da kontrol etmeliyiz.
            case 2:
                if (durum == 1) {
                    if (aktifSekil[2] > 10) {
                        if ($('#kare' + (aktifSekil[2] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] + 10)).is(":visible") == false) {
                            for (var i = 0; i < 4; i++) {
                                $('#kare' + aktifSekil[i]).css('display', 'none');
                            }
                            aktifSekil[0] = aktifSekil[2];
                            aktifSekil[1] = aktifSekil[0] - 10;
                            aktifSekil[2] = aktifSekil[3] + 10;
                            aktifSekil[3] = aktifSekil[2] - 10;
                            durum = 2;
                        }
                    }
                } else if (durum == 2) {
                    if ($('#kare' + (aktifSekil[2] - 1)).is(":visible") == false && $('#kare' + (aktifSekil[2] - 2)).is(":visible") == false && $('#kare' + (aktifSekil[3] - 10)).is(":visible") == false && !(aktifSekil[0] % 10 == 1)) {
 
                    }
 
                }
                break;
Adım 7: Şart cümlemiz doğru sonucu verdiyse mevcut şekli gizleyelim. Yeni şeklin konumunu belirleyelim.
            case 2:
                if (durum == 1) {
                    if (aktifSekil[2] > 10) {
                        if ($('#kare' + (aktifSekil[2] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] - 10)).is(":visible") == false && $('#kare' + (aktifSekil[3] + 10)).is(":visible") == false) {
                            for (var i = 0; i < 4; i++) {
                                $('#kare' + aktifSekil[i]).css('display', 'none');
                            }
                            aktifSekil[0] = aktifSekil[2];
                            aktifSekil[1] = aktifSekil[0] - 10;
                            aktifSekil[2] = aktifSekil[3] + 10;
                            aktifSekil[3] = aktifSekil[2] - 10;
                            durum = 2;
                        }
                    }
                } else if (durum == 2) {
                    if ($('#kare' + (aktifSekil[2] - 1)).is(":visible") == false && $('#kare' + (aktifSekil[2] - 2)).is(":visible") == false && $('#kare' + (aktifSekil[3] - 10)).is(":visible") == false && !(aktifSekil[0] % 10 == 1)) {
                        for (var i = 0; i < 4; i++) {
                            $('#kare' + aktifSekil[i]).css('display', 'none');
                        }
                        aktifSekil[0] = aktifSekil[0] + 9;
                        aktifSekil[1] = aktifSekil[0] + 1;
                        aktifSekil[2] = aktifSekil[1] - 10;
                        aktifSekil[3] = aktifSekil[2] + 1;
                        durum = 1;
 
                    }
 
                }
                break;
Projemizi kaydedip çalıştıralım. Bu şekilde de dönme işleminin gerçekelştiğini görürsünüz. Bir sonraki derste görüşmek üzere.

 
İlgili Makaleler
Facebook Web Sayfasına Ait Üye Kayıt Formunu Tasarlayan Programı JQuery İle Kodlayınız
2022 TYT Matematik Ondördüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Üçüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Resmin Ekranın Sol Üst Köşesinden Başlayarak Büyüyerek Küçülmesini Sağlayan Programı JQuery İle Yapınız
Core Mvc Projesinde Resmin Sol Üstten Başlayıp Büyüyerek Ekranı Kapladığı Animasyonu Jquery Dilinde Kodlayınız
JQuery Script Dilinde bind ve unbind Fonksiyonları
2022 TYT Matematik Yirmiüçüncü Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Birinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Html Dom Yapısını Anlamak
2022 TYT Matematik Altıncı Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Onbeşinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 TYT Matematik Onbirinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
2022 LGS Boyanmayan Kutudaki Üslü İfadeyi Bulan Matematik Sorusunu jQuery Diliyle Bulan Uygulama
Resmin Sol Üstten Başlayıp Büyüyerek Ekranı Kapladığı Animasyonu Jquery Dilinde Kodlayınız
JQuery Yardımıyla Web Sayfasından JSON Veri Çekme
Koordinat Düzleminde Verilen İki Nokta Arasındaki Uzunluğu Bulan Jquery Uygulamasını Yapınız
2022 TYT Matematik Onyedinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
AYT 123 Sayısına Sırasıyla Uygulanan Adımlar Sonucunda 75. Adımda Elde Edilen Sayıyı Bulan JQuery Uygulaması
2022 TYT Matematik Yirmibirinci Sorunun Çözümünü jQuery Diliyle Web Sayfasında Kodlama
Paralelkenarın Alanını Bulan Programı JQuery Script Dilinde Yapınız

Yorum Ekle
   
Kötü
İyi