JavaScript framework kütüphaneleri ile uygulanmış bir kaç örnek ve kodları ..
1 – Puzzel uygulaması (Online Bulmaca)

puzzel
puzzel

Kaynak Konu :

(function() {var p = $(‘puzzle’), info = $(‘puzzleinfo’), moves = 0;Sortable.create(‘puzzle’, {tag: ‘img’, overlap: ‘horizontal’, constraint: false,onUpdate: function() {info.update(‘You’ve made ‘ ( moves) ‘ move’ (moves > 1 ? ‘s’ : ”));if (Sortable.sequence(‘puzzle’).join(”) == ‘123456789’)info.update(‘You’ve solved the puzzle in ‘ moves ‘ moves!’).morph(‘congrats’);}});})();

2 – List Morph Demo

List Morph Demo
List Morph Demo

Bu uygulama Liste şeklinde yazılmış yazıların yerlerini üzerine tıklanınca ramdom olarak değiştiriyor… uygulamayı görmek için burayı tıklayın. Nasıl Yapıldığı konusunda buradan bilgi edinebilirsiniz. Kaynak Kodu :

Array.prototype.shuffle = function() {return this.sortBy(Math.random);};(function() {function foo() {$(‘scripty_morph_demo’).select(‘div’).shuffle().each(function(e, i) {e.morph(‘top:’ + i*e.getHeight() + ‘px’, { duration: 0.4 });});}$(‘scripty_morph_demo’).observe(‘click’, foo);foo();})();

3 – Effect.Highlight (Aydınlanma Efekti)

Aydınlanma - 1
Aydınlanma – 1

Bu Uygulama Div katmanlar ile oluşturduğunuz kutucuklara tıklama ile geçişli aydınlatma efektleri vermenizi sağlar…

Aydınlanma - 2
Aydınlanma – 2
Aydınlanma - 3
Aydınlanma – 3

Demosu için buraya bakabilirsiniz.

Kanak Kodu :

Kutucuğu aydınlatmak için aşağıdaki linki tıkla...Highlight me!(Aydınlat Beni!)

Daha Fazla Javascript ve Demo uygulamalar için buraya Javascript Framework Örnekleriiçin buraya gözatabilirsiniz… Örnek uygulamalar ve Önizlemeler mevcut…