Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   jQuery плагин с моддержкой методов (https://javascript.ru/forum/jquery/56485-jquery-plagin-s-modderzhkojj-metodov.html)

falkone 18.06.2015 13:50

jQuery плагин с моддержкой методов
 
Реализовал нехитрый слайдер в виде плагина, все работает отлично, цыпочку вызово поддерживает, но не могу разобратся с методами
http://stackoverflow.com/questions/1...n-with-methods

Что делаю не так, в чем проблема?

(function($) {

	var methods = {
		init: function() {
			var el = this,
			resize = 100,
			lengthSlides = $(el).find('.slider-item').length,
			widthSlides = lengthSlides * resize + '%',
			currentSlide = 1;
			$(el).find('.sliderItemWrapper').width(widthSlides);
				var inter = setInterval(nextSlide, 2000);
				$(el).hover(function() {
					clearInterval(inter);
				}, function() {
					inter = setInterval(nextSlide, 2000);
				});
				$(el).find('.slider_left').click(prevSlide);
				$(el).find('.slider_right').click(nextSlide);
				$(el).find('.slider-item:nth-child(2) .slider-img').addClass('small-img');
			},

			slideAnim: function() {
				$(el).find('.slider-img').removeClass('active-img slider-img-left', 1500, "easeOutSine");
				$(el).find('.des-slide').removeClass('des-slide-show', 1500, "easeOutSine");
				$(el).find('.des-slide').addClass('des-slide-hide', 500, "easeOutSine");
				$(el).find('.slider-img').addClass('small-img', 1500, "easeOutSine");
				$(el).find('.slider-item:nth-child('+currentSlide+') .slider-img').addClass('active-img slider-img-left', 1500, "easeOutSine");
				$(el).find('.slider-item:nth-child('+currentSlide+') .des-slide').addClass('des-slide-show', 1500, "easeOutSine");
			},

			nextSlide: function() {
				if ( currentSlide == lengthSlides )
					currentSlide = 0;
				$(el).find('.sliderItemWrapper').animate({
					'left': -currentSlide * resize + '%'
				}, 2000);
				currentSlide++;
				slideAnim();
			},

			prevSlide: function() {
				currentSlide--;
				if ( currentSlide == 0 )
					currentSlide = lengthSlides;
				$(el).find('.sliderItemWrapper').animate({
					'left': -(currentSlide -1) * resize + '%'
				}, 2000);
				slideAnim();
			}
	};

		 $.fn.slide = function(methodOrOptions, options) {
		 	return this.each(function() {
        if ( methods[methodOrOptions] ) {
            return methods[ methodOrOptions ].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } else if ( typeof methodOrOptions === 'object' || ! methodOrOptions ) {
            return methods.init.apply( this, arguments );
        } else {
            $.error( 'Method ' +  methodOrOptions + ' does not exist on jQuery.tooltip' );
        }    
        });
    };
})(jQuery);

рони 18.06.2015 14:10

falkone,
и что с методами не так?
и может рабочий макет полностью

falkone 18.06.2015 15:08

Вложений: 1
Вот собственно код,
script/slide.js лежит сам код плагина, ниже закоментирована часть которая работает но без методов.

Для удобства закинул сюда http://jsfiddle.net/falkone/2j8dn0hy/1/
jQuery UI не подключал, по этому переходы резкие.

рони 18.06.2015 16:23

falkone,
var inter = setInterval(nextSlide, 2000);
нету есть el.nextSlide или methods["nextSlide"]из-за таких строк и не работает

falkone 18.06.2015 16:53

Даже не знаю, попробовал подобавлять this, el вначале консоль указавыла на места с которых не может взять значение а потом ни одной ошибки а результат нулевой.

рони 18.06.2015 17:16

falkone,
так веть и currentSlide и прочее видны только в init

рони 18.06.2015 17:25

falkone,
как вариант $(el).data("slide", {currentSlide : 1, resize : 100}), но лучше бы кто-то, кто понимает в обьектах ,глянул.


Часовой пояс GMT +3, время: 13:38.