Salı , 27 Haziran 2017
Anasayfa » JavaScript » Jquery

Jquery

Jquery Modal İletişim Kutuları

Kullanıcılara bilgi vermek yada kullanıcılardan bilgi almak için jquery dialog modal kullanma en ideal yollardan biridir.  Dialog kutularını uyarı, hata yada bilgilendirme amacı  için de kullanabilirsiniz.  Bir çok modern front-end framework içinde dialog kutuları olmasına rağmen kullanım zorlukları nedeni ile pek tercih edilmektedir. Daha önceki bir yazıda sadece jquery dialog eklentisi ile modal oluşturup kullanmıştım. Eğer frameworkler içindeki dialoglar hoşunuza …

Devamını oku »

JQuery İle Resim Kaydırma

Bu örneğimizde JQuery ile butona tıklandığında resmin hareket etmesini sağlayacağız. İlk olarak JQuery’nin sitesinden JQuery dosyalarını indiriyoruz. Css ve JavaScript dosyalarını açarak çalışma dosyamıza bağlıyoruz. Ağaç yapısı şu şekilde olacaktır;

Devamını oku »

JQuery UI Tabs Menü Kullanımı

Bu örneğimizde JQuery’nin Ui eklentisini kullanarak Tabs Menü yapacağız. İlk olarak JQuery’nin sayfasından, JQuery ve JQuery-Ui eklenti dosyalarını indiriyoruz. Ui.css ve theme.css dosyalarını çalışma klasörünün içerisindeki eklenti klasörünün içerisine kopyalıyoruz. Dosyaların ağaç yapısı şu şekilde olacaktır;

Devamını oku »

JQuery Checked Kullanımı

Bu örneğimizde JQuery ile checkbox kullanarak resim gizleyip göstermeyi yapacağız. Bunun için ilk olarak JQuery’nin sitesinden JQuery dosyasını indiriyoruz ve çalışma dosyamıza bağlıyoruz. Daha sonra kendi açtığımız JavaScript dosyamızı çalışma dosyamıza bağlıyoruz.     HTML: Resmi gizlemek ve göstermek için bir checkbox oluşturuyoruz.  Yazdığımız kısa açıklamayı label etiketinin içerisine yapıyoruz. Bu sayede yazının üzerine basıldığında checkbox’da bundan etkilenecek. Daha sonra gizleyip …

Devamını oku »

JQuery ile İsim Listeleme

  Bu çalışmamızda JQuery ile <ul> etiketinin içerisine tanımladığımız dizideki isimleri yazdıracağız. Çalışmaya başlamadan önce ilk olarak JQuery’nin kendi sitesinden JQuery dosyasını indiriyoruz.  https://jquery.com/

Devamını oku »

Jquery Tanımı , Kullanımı ve İki Sayıyı Toplama-Çıkarma-Çarpma İşlemleri

JQuery’e Giriş Herkese merhaba, bu yazımda JQuery’den bahsedeceğim. jQuery bir JavaScript kütüphanesi olarak bilinir. 2006 yılına kadar çok fazla karmaşık JavaScript kütüphanesi kullanılıyormuş. John Resig ise jQuery’yi geliştirerek bu JavaScript kütüphanelerini daha sade ve anlaşılır bir hâle getirmiştir. Ardından web kullanıcılarının hizmetine sunmuştur. Birkaç sene içerisinde de jQuery tüm dünyada popüler olmuş. HTML5 ve CSS3 desteği oldukça fazladır. Sebebi ise 100% …

Devamını oku »

Çok Basit Jquery Slider

Jquery kullanarak çok fazla kodlama yapmadan kullanılabilecek güzel bir slider eklentisi.  Kullanacağım slider eklentisi kendi adı ile müstesne süper basit slider (super simple slider) eklentisi olarak ifade edebiliriz. 1.Adım: Jquery super simple slider eklentisini indirip proje klasörüne atıyoruz. (eklentiyi indirin) 2.Adım: Sliderı kullanacağımız temel html sayfasının aşağıdaki şekilde oluşturuyoruz. [crayon-5951bca6d5da0997293595/] 3.Adım:  body etiketlerinin arasına slider eklentisi için gerekli olan html kodunu …

Devamını oku »

Jquery Mask ile Input Nesnelerini Biçimlendirme

Jquery Mask Eklentisi web sayfası geliştiricilerinin kullandığı olmazsa olmaz eklentilerden bir tanesidir. Bu yazıda da bu eklentinin bazı önemli kullanımlarını açıklayacağım. Öncelikle Jquery Mask eklentisinin kabiliyetlerinden biraz bahsedelim. Jquery Mask ile Neler Yapılır? Jquery mask ile form nesnelerini telefon, tarih, posta kodu, iban numarası, kredi kartı numarası gibi biçimli göstermek için kullanılan bir eklentidir. Örn: 10/06/1980 gibi ekranda tarih değerini …

Devamını oku »

Jquery Dialog Kullanımı

JavaScript ile uyarı vermek (popup pencere açmak)  için window.alert() metodu kullanılırdı. Gelişen teknoloji ile artık alert() yerini daha modern tasarım ve tekniklere bırakmıştır. Bunlardan bir tanesi olan Jquery UI Dioalog nesnesinin kullanacağız. Modern popup penceresi olarak Jquery Dialog Nesnesini , window.alert()’in alternatifi olarak düşünebilirsiniz.

Devamını oku »

Jquery Datepicker – Türkçe Tarih Seçme

Doğru tarih formatı veritabanı ile web sayfası tasarımı arasında hep sorun olmuştur.  Özellikle Türkçe olarak ekranda gösterip Mysqle kaydetmek istiyorsak hep PHP ile ek düzenleme yapmak zorunda kalmışızdır. Bu yazıda bu sorunlara cevap olacak çözümler bulacaksınız.

Devamını oku »

Jquery ile Oluşturulan Nesneye Olay Atama

jquery ile oluşturulan nesneye tıklama

Jquery ile sonradan oluşturulan yada ajax ile çekilen nesnelere tıklamak için yazılan jquery kodlarını makalenin devamında bulabilirsiniz.   Jquery ile oluşturulmuş yada sonradan ajax ile bir şekilde dökümana eklenmiş olan nesnelere bind,click,mousemove vs metodlar ile mümkün değildir. Jquery bu işlemi gerçekleştirmek için on metodu geliştirilmiştir. Jquerynin eski versiyonlarında live ismi ile anılır. on metodunu kullanırken HTML belgesinde yüklenme sırasında oluşturulan bir etiket …

Devamını oku »

JQuery DataTable Kullanımı

HTML tablosu üzerine sıralama, sayfa geçişleri ve arama işlemlerini JQuery Datatable ile kolay bir şekilde gerçekleştirebiliriz.   Örneğimizi inceleyelim. Öncelikle HTML basit bir tablo oluşturuyoruz. Daha sonra JQuery DataTable için references larımızı ekliyoruz. DataTable Temel Kullanımı Kodlarımızın tamamlanmış hali: [crayon-5951bca6d77e3626609615/]   Data Table Türkçe Yapma DataTable kullandıktan sonra en sık sorulardan biri de DataTable nasıl Türkçe yapılır sorusudur?  DataTable yazılımcılarının …

Devamını oku »

Jquery Slider Eklentisi #CameraJS

Daha önce bir slider eklentisinden bahsetmiştim. Bazen sadece slider olması yeterli olmaz daha fazla özellik istersiniz. İşte bu slider eklentisi bir çok özelliği ile bir sliderdan isteyebileceğinizden fazlasını vererir.   Camera Slider  eklentisinin kurulumunu ve bazı temel özelliklerini detaylı açıkladım. Slider eklentimizin kurulumu için gerekli kütüphaneler; Jquery kütüphanesini indirin.İNDİR Jqury migrate kütüphanesini indirin.İNDİR(Camera jquerynin eski versiyonlarında bulunan bir özelliği kullanıyor.) …

Devamını oku »

Jquery UI Sürükle Bırak ile Liste Oluşturma

Jquery Ui ile sürükle bırak işlemi

 Uygulamanın kaynak kodunu İNDİR Jquery UI kullanarak sürükle bırak işlemleri hemen hemen her web sayfasında sıklıkla karşımıza çıkmakdır. E-ticaret sistemlerinde sepet, yönetim panellerinde menü düzenleme, iletişim formlarında çeşitli özellikleri eklemek ve çıkarmak için bir çok sayfada görmüşsünüzdür. Bende bu makalede basit bir şekilde sürükle bırak işlemi ve sürüklenmiş nesneyi silme işlemini nasıl yapacağımızı anlatacağım. Uygulamanın bitmiş hali yukarıdaki bağlantıda yada sayfanın …

Devamını oku »

Jquery Slider Eklentisi #Fotorama

Hemen hemen her sitede olmazsa olmazlardan birisidir sliderlar. Bu yazıda az kod(hiç javascript kodu yazmadan) bir slider nasıl oluşturulur onu anlatacağım. Kullanacağım slider eklentisi FOTORAMA; sliderı kullanmadan önce jquery kütüphanesi ve fotorama dosyalarını indirmelisiniz. Jquery      fotorama Dosyaları indirdikten sonra örnek bir html dosyası içine kütüphanemizi ve css dosyamızı çağırıyoruz. Unutmayın sitenizde jquery eklentisi kullanıyorsanız. Öncelikle jquery kütüphanesini yükleyin sonra …

Devamını oku »

Jquery UI Accordion Paneli

JQUERY ACCCORDION PANEL

Jquery UI kütüphanesi etkileşimli web projeleri için  hazır nesneler etkin birşekilde kullanma şansı veren güçlü bir kütüphanesir. Bu kütüphane ile hazır Accordion, tab, tarih, tooltip , efectler kullanmak mümkündür.  Kütüphanede kullanılan nesnelerden bir kaç tanesini önem sırasına göre(benim sıralamam) bu makalede açıklayacağım.   Örneğin yanındaki linke tıklayarak çalışan uygulamayı indirebilirsiniz. Kütüphane kullanımına geçmeden önce ilk yapılması gerekenleri madde madde yazıyorum. 1.jquery …

Devamını oku »

Jquery Seçiciler

Bütün jquery seçicileri $() şeklinde tanımlanır. Seçicilerin basit kullanımlarını örneklerle açıklayacağım. Sayfada örnek olarak verilen HTML etiketlerini kullanarak işlemleri seçme  işlemlerini gerçekleştireceğiz. Tüm örneklerde kullanacağımız HTML etiketi aşağıdadir. [crayon-5951bca6da7f5234569071/]   Basit Seçiciler Etiket (tag) adı ile seçmek. $(“div”)  sayfadaki tüm div etiketlerini seçer. $(“p”) sayfadaki tüm p etiketlerini seçer. [crayon-5951bca6da7fc315370023/]     Class adı ile seçmek. Css’de olduğu gibi .classAdi …

Devamını oku »

Sayısal Loto Örneği (Javascript)

Sans oyunları gibi benzer oyunların algoritması programlama mantığı bakımından güzel algoritmalardır.  (oynanmasını kesinlikle karşıyım) Bu sayısal loto için gerekli olan algoritmayı daha önce başka bir sitede yayımlamıştım. Yapılan uygulamanın kodlarını yazılım bilişim sitesine eklemek istedim. Bir çok programlama dili ile hazırlamış olan uygulamayı ben de Javascript (Jquery) ile doğru çalışan bir örneğini hazırlayacağım. Şunu belirteyim. Uygulamanın doğru düzgün çalışan hali dost …

Devamını oku »