Архив

Публикации с меткой ‘jquery’
9 декабря 2021 Нет комментариев
$.fn.stickyfloat=function(options,lockBottom){
	var $obj=this;
	var parentPaddingTop=parseInt($obj.parent().css('padding-top'));
	var startOffset=$obj.parent().offset().top;
	var opts=$.extend({startOffset:startOffset,offsetY:parentPaddingTop,duration:200,lockBottom:true},options);
	$obj.css({position:'absolute'});
	if(opts.lockBottom){
		var bottomPos=$obj.parent().height()-$obj.height()+parentPaddingTop;
		if(bottomPos<0)
			bottomPos=0;
	}
	$(window).scroll(function(){
		$obj.stop();
		var pastStartOffset=$(document).scrollTop()>opts.startOffset;
		var objFartherThanTopPos=$obj.offset().top>startOffset;
		var objBiggerThanWindow=$obj.outerHeight()<$(window).height();
		if((pastStartOffset||objFartherThanTopPos)&&objBiggerThanWindow){
			var newpos=($(document).scrollTop()-startOffset+opts.offsetY);
			if(newpos>bottomPos)
				newpos=bottomPos;
			if($(document).scrollTop()<opts.startOffset)
				newpos=parentPaddingTop;
			$obj.animate({top:newpos},opts.duration);
		}
	});
};

Пример использования:

$(document).ready(function(){
	setTimeout(function(){
		$('#main .left').css('min-height',$('#main').height());
		$('#main .inner').stickyfloat({duration:500});
	},2000);
});
<div id="main">
	<div class="left">
		<div class="inner">content</div>
	</div>
	<div class="right"></div>
	<div class="clear"></div>
</div>
.left,.right{
	width:50%;
}
.left{
	position:relative;
	float:left;
}
.right{
	float:right;
}
.clear{
	clear:both;
}

Источник: https://ruseller.com/lessons.php?id=999&rub=32

Categories: Javascript Tags:
9 декабря 2021 Нет комментариев
$.fn.setCursorPosition=function(pos){
	if($(this).get(0).setSelectionRange){
		$(this).get(0).setSelectionRange(pos,pos);
	}
	else if($(this).get(0).createTextRange){
		var range=$(this).get(0).createTextRange();
		range.collapse(true);
		range.moveEnd('character',pos);
		range.moveStart('character',pos);
		range.select();
	}
};
function set_mask_cursor(){
	$('input[name="phone"]').on('click',function(){
		$(this).setCursorPosition(4);
	});
	$('input[name="code"]').on('click',function(){
		$(this).setCursorPosition(0);
	});
}
$(document).ready(function(){
	$("input[name=phone]").mask("+7 (999) 999-99-99");
	$("input[name=code]").mask("9999");
	set_mask_cursor();
});
Categories: Javascript Tags:
16 сентября 2021 Нет комментариев

Без циклической прокрутки:

var owl_catalog_item=$('.owl_catalog_item');
owl_catalog_item.owlCarousel({
	items:1,
	loop:false,
	margin:0,
	autoplay:true,
	autoplayTimeout:1000,
	autoplayHoverPause:false,
	dots:false,
	nav:false,
	navText:['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>'],
	responsive:{
		0:{
		},
		480:{
		},
		768:{
		}
	}
});
owl_catalog_item.trigger('stop.owl.autoplay');
$('.catalog .item').on('mouseenter',function(){
	if($(this).find('.owl_catalog_item a').length>1){
		$(this).find('.owl_catalog_item').trigger('play.owl.autoplay',[1000]);
	}
});
$('.catalog .item').on('mouseleave',function(){
	$(this).find('.owl_catalog_item').trigger('stop.owl.autoplay');
	$(this).find('.owl_catalog_item').trigger('to.owl.carousel',0);
});

С циклической прокруткой:

var owl_catalog_item=$('.owl_catalog_item');
owl_catalog_item.owlCarousel({
	items:1,
	loop:true,
	margin:0,
	autoplay:true,
	autoplayTimeout:1000,
	autoplayHoverPause:false,
	dots:false,
	nav:false,
	navText:['<i class="fa fa-angle-left"></i>','<i class="fa fa-angle-right"></i>'],
	responsive:{
		0:{
		},
		480:{
		},
		768:{
		}
	}
});
owl_catalog_item.trigger('stop.owl.autoplay');
$('.catalog .item').on('mouseenter',function(){
	$(this).find('.owl_catalog_item').trigger('play.owl.autoplay',[1000]);
})
$('.catalog .item').on('mouseleave',function(){
	$(this).find('.owl_catalog_item').trigger('stop.owl.autoplay');
});
Categories: Javascript Tags:
var char_timeout=50;
var story_timeout=2000;
var placeholders=new Array();
	placeholders[0]='труба';
	placeholders[1]='проточный водонагреватель';
	placeholders[2]='фильтр';
	placeholders[3]='бак';
	placeholders[4]='сифон';
	placeholders[5]='теплый пол';
	placeholders[6]='душевая кабина';
	placeholders[7]='емкость';
	placeholders[8]='горелка';
	placeholders[9]='арматура';
	placeholders[10]='бойлер';
	placeholders[11]='газовый котел';
	placeholders[12]='наcос';
function start_printing(){
	item_count=Number(placeholders.length);
	current_placeholder=-1;
	current_length=0;
	input=$('input[name=search_string]');
	run_printing();
}
function run_printing(){
	var timeout;
	if(current_length==0){
		current_placeholder++;
		current_placeholder=current_placeholder%item_count;
		placeholder=placeholders[current_placeholder].replace(/"/g,'-');
	}
	input.attr('placeholder',placeholder.substring(0,current_length)+current_char());
	if(current_length!=placeholder.length){
		current_length++;
		timeout=char_timeout;
	}
	else{
		current_length=0;
		timeout=story_timeout;
	}
	setTimeout("run_printing()",timeout);
}
function current_char(){
	if(current_length==placeholder.length){
		return "";
	}
	else{
		return "|";
	}
}
start_printing();
Categories: Javascript Tags:
$('input[type=number]').keyup(function(){
	var max=parseInt($(this).attr('max'));
	var min=parseInt($(this).attr('min'));
	var val=$(this).val();
	if(val<min){
		$(this).val(min);
	}
	if(val>max){
		$(this).val(max);
	}
});
Categories: Javascript Tags:
$(".element").prop("clientWidth");
//или
$(".element").prop("scrollWidth");

вместо

$('.element').width()
Categories: Javascript Tags:
(function($){
	$.widget("ui.onDelayedKeyup",{
		_init:function(){
			var self=this;
			$(this.element).keyup(function(){
				if(typeof(window['inputTimeout'])!="undefined"){
					window.clearTimeout(inputTimeout);
				}
				var handler=self.options.handler;
				window['inputTimeout']=window.setTimeout(function(){
					handler.call(self.element)
				},self.options.delay);
			});
		},
		options:{
			handler:$.noop(),
			delay:500
		}
	});
})(jQuery);
$('header .search input[type=text]').onDelayedKeyup({
	handler:function(){
		var string=$(this).val();
		if(string.length>3){
			//.......
		}
	},
	delay:1000
});
Categories: Javascript Tags: