CC Slider Dengan JQuery

jQuery adalah pustaka JavaScript kecil bersumber terbuka yang menekankan pada interaksi antara JavaScript dan HTML. Pustaka ini dirilis pada Januari 2006 di BarCamp NYC oleh John Resig dan berlisensi ganda di bawah Lisensi MIT dan GPL.

Microsoft dan Nokia telah mengumumkan akan mengemas jQuery di platform mereka ^[1]. Microsoft awalnya mengadopsinya dalam Visual Studio ^[2] untuk digunakan dalam ASP.NET AJAX dan ASP.NET MVC Framework, sedangkan Nokia akan mengintegrasikannya dalam kerangka Web Run-Time mereka. (Source: wikipedia)

Pada artikel kali ini mengambil contoh yang lumayan asyik yaitu CCSlider dengan JQuery yang mana pada source ini akan menampilkan literasi antara image yang satu dengan image yang lain translationnya berbentuk 3D dan 2D.

Penggalan Source:

/* jQuery CCSlider Plugin 1.0 
 * Copyright 2011, Nilok Bose  
 * http://codecanyon.net/user/cosmocoder
*/


(function($) {
    $.fn.ccslider = function(options) {
        // Extend the defaults, over-writing them with anything passed  

by the caller
        var opts = $.extend(true, {}, $.fn.ccslider.defaults, options);
  
        // Iterate over each element
        return this.each(function() {
  var $slider = $(this),$wrapper  

=$slider.wrapInner('<div class="slider-innerWrapper"/>')

.find('.slider-innerWrapper'),
 $controls = $('<div class="slider-controls"/>').appendTo($slider),
 width = $slider.width(),
 height = $slider.height(),
 cWidth = width,
 cHeight = height,
 $images = $slider.find('img'),
 slideNum = $images.length,
 effect,
 effectType,
 randanim = false,
 imageWidth = opts._3dOptions.imageWidth,
 imageHeight = opts._3dOptions.imageHeight,
 innerSideColor = opts._3dOptions.innerSideColor,
 makeShadow = opts._3dOptions.makeShadow,
 shadowColor = opts._3dOptions.shadowColor,    
 slices = opts._3dOptions.slices,
 delay = opts._3dOptions.delay,
 easing = opts._3dOptions.easing,

fallBack = opts._3dOptions.fallBack,
 animSpeed,
 index = opts.startSlide,
 pause = false,
 animating = false,
 hover = false,
 clock;   
   

Untuk melihat source lengkapnya Klik Disini untuk Resources Websitenya anda dapat mengunjungi JDLGrap dan untuk melihat demo Scriptnya dapat dilihat di : http://jdlgraphixs.com/ccslider-jquery-3d-slideshow-plugin.zip%20Folder/Source/demo/ .

• Tweet
• Share
• Share
• Share
• Share