common/jMyCarousel.js

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

/* 
 * 
 * Copyright (c) 2007 e-nova technologies pvt. ltd. (kevin.muller@enova-tech.net || http://www.enova-tech.net)
 * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
 * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
 *            __             ___      ___    __  __     __     
 *          /'__`\    __   /' _ `\   / __`\ /\ \/\ \  /'__`\   
 *         /\  __/  /\__\  /\ \/\ \ /\ \_\ \\ \ \_/ |/\ \_\.\_ 
 *  (o_    \ \____\ \/__/  \ \_\ \_\\ \____/ \ \___/ \ \__/.\_\    _o)
 *  (/)_    \/____/         \/_/\/_/ \/___/   \/__/   \/__/\/_/   _(\)
 *       
 *           Prevents Headaches !  
 * 
 * JMyCarousel is inspired and based on JCarouselLite, an original concept by Ganeshji Marwaha
 *  
 *
 * $LastChangedDate: 2007-06-22 20:08:34 -0500 (Thu, 22 Nov 2007) $
 * $Rev: 15 $
 *
 * Version: 0.1
 */

(function ( $ ) {                  // Compliant with jquery.noConflict()
$.fn.jMyCarousel = function(o) {   
    o = $.extend({
        btnPrev: null,			// previous button customization
        btnNext: null,			// next button customization
        mouseWheel: true,		// shall the carousel handle the mousewheel event to animate ?
        auto: false,			// shall the carousel start automatically

        speed: 500,				// speed in ms of the animation.
        easing: 'linear',		// linear animation.

        vertical: false,		// set the carousel in a vertical mode
        circular: true,			// run in circular mode. Means : images never reach the end.
        visible: '4',			// size of the carousel on the screen. Can be in percent '100%', in pixels '100px', or in images '3' (for 3 images)
        start: 0,				// position in pixels that the carousel shall start at
        scroll: 1,
        
        step: 50,				// value in pixels, or "default"
        eltByElt: false,		// if activated, the carousel will move image by image, not more, not less.
        evtStart : 'mouseover',	// start event that we want for the animation (click, mouseover, mousedown, etc..)
		evtStop : 'mouseout',	// stop event that we want for the animation (blur, mouseout, mouseup, etc..)
        beforeStart: null,		// Not used yet
        afterEnd: null			// Not used yet
    }, o || {});

    return this.each(function() {                           // Returns the element collection. Chainable.   
        var running = false, animCss=o.vertical?"top":"left", sizeCss=o.vertical?"height":"width";
        var div = $(this), ul = $("ul", div), tLi = $("li", ul), tl = tLi.size(), v = o.visible;
        var mousewheelN = 0; // will help for the mousewheel effect (to count how many steps we have to walk ahead)
		var defaultBtn = (o.btnNext === null && o.btnPrev === null) ? true : false;
		var cssU = (v.toString().indexOf("%") != -1 ? '%' : (v.toString().indexOf("px") != -1) ? 'px' : 'el');
		var direction = null; // used to keep in memory in which direction the animation is moving
        
        // circular mode management
        // we add at the end and at the beginning some fake images to make the circular effect more linear, so it never breaks
        // It is still possible to improve the memory management by adding exactly the number of images requested.
        if(o.circular) {
			var imgSet = tLi.clone();