Kayıtlar

Orta Seviye Javascript etiketine sahip yayınlar gösteriliyor

Ön Singülar Korteks (ACC) İçin Nefes Egzersizi: Zihni Sakinleştiren Bilim Temelli Bir Yöntem

Resim
ACC Nefes Egzersizi: Ön Singülar Korteksi Sakinleştirme Rehberi Aşırı düşünme, zihinsel yorgunluk ve kaygıyı azaltmaya yardımcı olabilecek bilim temelli nefes egzersizi ve sinir sistemi düzenleme teknikleri. Modern yaşamda insan beyni sürekli alarm halinde çalışabiliyor. Özellikle aşırı düşünme, hata yapma korkusu ve zihinsel geviş getirme gibi durumlarda beynin belirli bölgeleri normalden daha yoğun aktive olabiliyor. Bu bölgelerden biri de ön singülar korteks yani ACC’dir. Bu yazıda ACC’nin ne olduğunu, neden aşırı aktif hale gelebildiğini ve hazırlanan nefes egzersizinin nasıl çalıştığını detaylı şekilde inceleyeceğiz. Ön Singülar Korteks (ACC) Nedir? ACC, beynin dikkat, hata k...

Beyin Sisini(Brain Fog) Gidermek için Online İçin Egzersiz

Resim
🧠 Zihin Berraklaştırıcı Derin Nefes Göz Takibi Refleks Odak Başla Daire büyürken burnundan derin nefes al, sabitken tut, küçülürken ağzından yavaşça ver. Başlat / Durdur Başını sabit tut, sadece gözlerinle topu takip et. Bu hareket sinir sistemini yatıştırır. Yatay Döngüsel Durdur Kırmızı yanan kareye mümkün olduğunca hızlı tıkla. Dikkati şimdiki ana getirir. Skor: 0 Oyunu Başlat

JavaScript Başa Dön | Scroll To Up Butonu Kodu

Resim
Sitelerde çokça kullanılan yukarı çık, başa dön vb. isimlerle adlandırılan buton kodu. <script>   var btnP =0;   window.addEventListener("load",function(){     btnP =window.scrollY;   });   window.addEventListener("scroll",function(){       scrollStat();   });   function scrollStat(){     btnP =window.scrollY;     if(btnP <=600 ){       document.getElementById("toTopBtn").className ="scrollToTopBtn";     }     else{       document.getElementById("toTopBtn").className ="scrollToTopBtn scrollToTopBtnShow";     }   }   function scrollToTop(){     window.scrollTo(0,0);     scrollStat();   }   </script>   <style>     *{       scroll-behavior: smooth;     }     .scrollToTopBtn{       position:fixed;       bottom:3%; ...

JavaScript ile Mesai Sayacı

Resim
Bu çalışmamda JavaScript ile bir geri sayım sayacı yaptım. Input elemanına bitiş zamanını yazıp butona tıkladığınızda belirlediğiniz saate kaç saat kaldığını görebilirisiniz. Bu uygulamada input elemanına yapılan girişleri sınırlandırdım. Program klavyeden girilen değerin sayısal olup olmadığını kontrol ediyor ve girilen değerleri saat formatına göre HH:MM:SS şeklinde düzenliyor. Javascript mesai sayacının kodları aşağıdaki gibidir. Lütfen mesai bitiş saatini girin Kodları yazarken  https://www.w3schools.com/howto/howto_js_countdown.asp linkindeki sayfadan yararlandım Kodun çalışan örneğini buraya ekliyorum. Dilerseniz günün bir saatini girip kalan sürenin geriye doğru sayılmasını deneyimleyebilirsiniz. Lütfen mesai bitiş saatini girin

Javascript SEO Metin İşaretleme Editörü

 SEO metni oluştururken işaretlemede kolaylık sağlamak amacıyla basit bir işaretleme editörü yaptım SEO Editör SEO Metin İşaretleme Editörü İstediğiniz işareti seçin P Em Strong H1 H2 H3 H4 H5 H6 İşaretle ve Ekle İşaretlemek istediğiniz metni girin Metnin işaretlemek istediğiniz yerlerini kutudan seçin ve yukarıdaki menüden etiket seçimini yapıp, İşaretle ve ekle butonuna basın. İşlem sonucu aşağıdaki gibi görünecektir.

Sliderli Product Box Örneği

Resim
  Sliderli Product Box Kodları :  <style> .productBox{ display:block; position:relative; width:25%; height:auto; float:left; box-sizing:border-box; border:solid 1px #dedede; border-radius:1rem; padding:.3rem; margin:.3%; background:#fff; } .productImages{ position:relative; width:100%; height:auto; display:block; padding-bottom:100%; box-sizing:border-box; } .productImage{ margin:auto; max-width:85%; height:auto; display:none; position:absolute; z-index:1; top:0; left:0; right:0; bottom:0;box-sizing:border-box;} .productImage:nth-child(1){display:block;} .imageThumbs{display:flex;width:100%;justify-content: center;margin:0px auto;} .imageThumbsItem{ display:block; border:solid 1px #dedede; width:1rem; height:1rem; border-radius:50%; margin:1%; box-sizing:border-box; cursor:pointer; } </style...

Javascript Büyüteç Uygulaması

Resim
Saf Javascript ve CSS kullanarak basit bir büyüteç programı yazdım. Javascript Büyüteç Kodları: HTML Kodu; <div id="resimKabi">   <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzzIU2K83cIbm0r_wB8lrZ5m3iSKchB-WolIEDvxFCz3BuYLB-g2_keCJ6QxbpfXBJ9tYjOQtWTn3sEub5tOycXxKFx_gK99s3jsUZckLWCyFEA_lab-T0A5voDQcXy0fLxjJopxevCa4/s1600/lotr-ring.jpg" />   <div id="buyutec"></div> </div> CSS Kodu; #resimKabi {   width: 100%;   height: auto;   display: block;   position: relative;   overflow: hidden; } #resimKabi img {   display: block;   width: 100%;   height: auto; } #buyutec {   width: 100px;   height: 100px;   background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzzIU2K83cIbm0r_wB8lrZ5m3iSKchB-WolIEDvxFCz3BuYLB-g2_keCJ6QxbpfXBJ9tYjOQtWTn3sEub5tOycXxKFx_gK99s3jsUZckLWCyFEA_lab-T0A5voDQcXy0fLxjJopxevCa4/s1600/lotr-ring.jpg); ...