Jquery ile Sıralanabilir Nesne Grupları Yaratma – Sortable

Merhaba, bu yazımda jquery ile sortable nesne grupları oluşturmayı anlatmaya çalışacağım.

Dikkat ettiyseniz nesne grupları diyorum. Yani birden fazla, aynı cinsten nesneyi kendi aralarında sıralamaya çalışacağız. Daha anlaşılır olması açısından buradaki örneğe bakınız. Örnekte <li> etiketleri birbirleri arasında yer değiştirebiliyor. Sürüklenebilir olması açısıyla draggable nesnelere de benzemiyor değiller.

Ne yapmaya çalıştığımızı anlattıktan sonra işin detayına girelim, öncelikle gerekli kütüphaneleri sayfamıza entegre etmemiz gerekiyor.

Jquery ile Boyutlandırılabilen Nesne Yaratma – Resizable

Jquery ile draggable ve droppable nesneler yaratmayı anlattıktan sonra şimdi de yeniden boyutlandırılabilen nesneler oluşturmayı anlatacağım.

Yeniden boyutlandırmayı textarea tagından bilirsiniz. Kendisi doğal olarak boyutu ayarlanabilen bir elementtir. Fakat jquery ile dilediğiniz tüm elementleri yeniden boyutlandırılabilir nesneler haline getirebilirsiniz. Yazının başlangıcı için örnek olması açısından buradaki örneğe bakabilirsiniz.

Resizable nesneler oluşturmak için gerekli kütüphaneleri sayfamıza ekleyelim.

Jquery ile Bırakılabilir Nesne Yaratma – Droppable

Merhaba bu yazımda jquery ile droppable nesne oluşturmayı anlatacağım.

Droppable kelimesini nasıl türkçeye çevireceğim bilemedim. En uygunu bırakılabilir geldi bana, eğer daha güzel bir şekilde çevirebilen varsa, rica ediyorum yazsın. Çünkü böyle pek iyi olmadı. :)

Jquery de droppable nesne oluşturabilmek için öncelikle sürüklenebilen nesneler oluşturulmalıdır. Bu ikisi gördüğüm kadarıyla beraber çalışıyorlar. Yani sürüklenebilen elementi droppable nesnenin üzerine bırakacağız. Olayı daha iyi anlamak için öncelikle buradaki örneğe bakmanızı tavsiye ediyorum.

Jquery ile Sürüklenebilir Nesne Yaratma – Draggable

Bu yazımda jquery ile hareket edebilen nesneler yaratmayı ve bu nesneleri nasıl kontrol edebileceğimizi anlatmaya çalışacağım.

Öncelikle bu işlem için gerekli kütüphaneleri sırasıyla sayfamıza entegre etmemiz gerekiyor.

<script src="jquery-1.6.1.js"></script>
<script src="jquery.ui.core.js"></script>
<script src="jquery.ui.widget.js"></script>
<script src="jquery.ui.mouse.js"></script>
<script src="jquery.ui.draggable.js"></script>

Arama
RSS
Beni yukari isinla