drag and drop | bildirgec.org

öğelerin sürüklenmesini sağlayan eklentiyi bir önceki yazıda tanıtmıştım. şimdi sürüklenen öğelerin bırakıldığı yerleri ve yapmanız gereken işleri kolaylaştıran "drop" yani bırakma eklentisini tanıtacağız.

______________detaylar______________
jquery indir
Eklentiyi indir
eklenti anasayfası
lisans koşulları
genel demo sayfası
______________ basic ______________
en basit haliyle sürüklenebilir öğeleri içine bırakabileceğiniz bir bölge oluşturmanızı sağlar. öğeyi içine sürüklediğinizde tepki veren bir bölge oluşturursunuz.
demo
______________ active ______________

jquery + isimli kütüphane sayesinde web sitelerine büyük bir hareketlenme geldi. bu yazılımın bu kadar sevilmesindeki en büyük neden belki de kolay anlaşılması ve en zor efektleri bile kısa komutlarla uygulama imkanı vermesidir. açık kaynaklı bir teknoloji olduğu için (javascript) 3. kişiler kolayca eklentiler üretebiliyor ve jquery sürekli güncelliğini korumayı başarıyor.

bu yazıda çok profesyonelce hazırlanmış bir eklenti tanıtılacak. bu eklenti sayesinde web sayfanızdaki her şeyi mouse ile tutup bir yere sürükleme özelliği katabilirsiniz ancak sadece tut-sürükle-bırak ritüeline sıkışmak zorunda değilsiniz. ek olarak onlarca opsiypnu bulunuyor. eklentinin hüneri de zaten opsiyonlarında gizli.

______________detaylar______________
jquery indir
Eklentiyi indir
eklenti anasayfası
lisans koşulları
genel demo sayfası
______________ basic ______________
en basit biçimde web sayfasındaki herhangi bir öğeyi mouse ile sürüklemenizi sağlar.
demo
______________ relative ______________
öğeleri sayfa içinde sınır tanımadan sürüklenebilir olmasını sağlar.
demo

İngilizce adına editable-jquery-tree-with-php-codes dediğimiz, kulağa biraz garip gelse de veya ben biraz garip çevirmiş olsam da Türkçe adına Düzenlenebilir jquery ağaç yapısı - PHP Kodlu dediğimiz bu bileşen, bir projede kullanmak üzere hazırladığım ama projenin hayata geçememesinden dolayı kullanamadığım jquery javascript çercevesi üzerinde çalışan, simple tree eklentisini kullanan basit bir ağaç yapısı (treeview). Bazı arkadaşlar kullanırlar diye google code da bir proje oluşturdum ve duyduğuma göre ecnebi ve yerli dostlardan bileşeni kullananlar varmış.

Bana göre diğerlerinden farkı php kodlu olması ve eleman ekleme, silme, düzenleme ve sürükle bırak işlemlerini kolayca yapması.

Şu an bu bileşen hem veritabanı (mysql) üzerinde hem de dosya sistemi üzerinde verilerin dosya ve klasör tipinde tutulmasını sağlıyor.

Umarım bazı arkadaşların işine yarar.

Mozilla tarafından geliştirilmekte olan Firefox 3.5 sürümü web geliştiricilerinin yüzünü güldürecek cinsten yenilikler ile gelmeye hazırlanıyor. Birçok gelişmekte olan web standartını destekleyecek biçimde piyasaya çıkacak olan Firefox 3.5, tasarımcıların hünerlerini sergileyebilmesi için birçok olanak sunacak.

Firefox 3.5 ile desteklenecek standartlar ve yapılacak yenilikler aşağıda listelendi.

HTML5 desteği
Daha önce yeni html5 tag'leri ve kullanım şekilleri yazısında belirtilen özelliklerin bir kısmı firefox 3.5 ile kullanılabilir olacak.

• Audio ve video tag'leri desteklenecek.
• Siteler arasında sürükle ve bırak (drag & drop) özelliği etkin olacak.

CSS cephesinde gelişmeler

• @font-face desteklenecek. Sitelerdeki font'lar ziyaretçilerin bilgisayarlarına indirilip siteler her font ile sorunsuzca görünebilecek.
• ::before ve ::after geliştirilecek
• media sorgulamaları geliştirilecek
• -moz-opacity desteği kalkacak. opacity özelliği eklenecek
• text-shadow ile yazıları gölgelendirme desteklenecek
• word-wrap özelliği eklenecek
• ziyaretçinin bilgisayarında tanımlanan link bilgilerine ulaşım için -moz-nativehyperlinktext desteği gelecek
• -moz-window-shadow desteği gelecek
• -moz-transform desteği gelecek

aşağıdaki adreste, bize her zaman lazım olacak jQuery uygulamaları ufak açıklamalar ve preview-demo şeklinde anlatılmış.
yetmemiş, yazar bir de internet üstünde çalışan ve her zaman işe yarayabilecek olan uygulamaları da listelemiş.

birkaç tanesi aşağıda:

slider gallery:
apple'ın web sitesindekine benzer, ürün kaydırma çubuğu, az ürününüz varsa ve internette bir mağazanız, bu sizin sitenizde çok şık durabilir.

demosu burada. script ana sayfası burada.

web sitenizde kullanabileceğiniz ya da kod geliştirirken size ilham verecek (open source) açık kaynak kodlardır.

sayfanızdaki küçük reimlerin orjinal hallerini, kullanıcıyı başka bir sayfaya götürmeden göstermenizi sağlar. (arka planı siyah yaparak, kapatma butonu ile birlikte beyaz bordürlü bir şekilde gösterir)
bir zaman çizelgesi üzerinde, bölgelerin arasındaki zaman farkını göstermeye yarar.

reflection.js resimlerinize yada logolarınıza hiçbir işlem yapmadan yansıma özelliği katar.
web 2.0 sitelerde bolca görebilirsiniz, farklı bir yöntem.
(class="reflect rheight50 ropacity33" width="435") sitenizdeki her resme bu yöntemle yansıma ekleyebilirsiniz.

elinizdeki verileri web sitenizde veya bilgisayarınızda grafiksel olarak sunmanızı çok kolay bir şekilde sağlar.
tek yapmanız gereken şablon seçip, başlığı, veri sınıflarını ve değerlerini yazı/xml dosyasına girmek, flash arayüz+animasyon+fare işlevi+güzel tasarıma sahiptir.
sitede farklı amaçlar için tasarlanmış örnekleride mevcuttur.

plotr ise pie & donut chart'ın java versiyonudur. görsel açıdan güzeldir fakat tarayıcıların java destekleri bakımından problem yaratabilir.

tarayıcı üzerinden anında mesajlaşma sistemidir.

rating sistemidir, basit ve güzel bir görünüme sahiptir. sitenize farklı türlerde oylama özelliği ekleyebilirsiniz.

farklı amaçlar için kullanabilceğiniz sekmeli içerik gösterimi sağlayan bir java scripttir. burda tavsiye etmiştim.

sürükle bırak tekniğine bir örnek:) sayfalarınızdaki resimlerin veya diğer içeriğin sürüklenip bırakılmasını sağlamak için kullanabilirsiniz.

yükleniyor...... olayını görselleştirmek için güzel bir örnektir. 4 farklı tasarımda örnek mevcuttur dilerseniz kendi tasarımınızı geliştirebilirsiniz.
sayfadaki icon'lara tıklayarak test edebilirsiniz.

tab content'in biraz daha gelişmiş versiyonudur, sekmelerde resimler veya kaynak kodlar göstermenizide sağlar.

üyelik sistemi olan web sitelerinde üyelerin profil bilgilerini güncellemelerini daha görsel ve aynı sayfada yapmalarını sağlamak için geliştirilmiş bir kod. burda flickr örnek verilmiş.

jquery için güzel bir ajax örneğidir. demo sayfasından test edebilirsiniz.

sayfalarında kod vb. içerik yada detaylı anlatım yayımlayan arkadaşlar için güzel bir okordiyon örneğidir. seri çalışır.

oylama barı'dır (rating bar) sitenize eklemek için kılavuz mevcuttur. kullandığınız cms sistemi için böyle bir eklenti mevcut değilse yahut cms geliştiriyorsanız kullanabileceğiniz bir scripttir.

aşağıdakileride açıklarsam destan olur heralde, bundan sonrasını size bırakıyorum. faydalı olması dileğiyle.
devamı:

clip2net internette dosya paylaşımı yapabileceğiniz siteler bir tanesi. yalnız diğer servislere ek olarak -en azından ben henüz başka bir örneğini görmedim- sitenin sunduğu küçük program sayesinde fareniz ile çerçeve içine aldığınız herhangi bir görüntüyü birkaç adımla internete yükleme olanağınız var. ayrıca bu imaj dosyaları da dahil olmak üzere yine program sayesinde dosyalarınızı sürükle bırak yöntemiyle upload edebilirsiniz.