Перейти к публикации

Рекомендованные сообщения

Привет! Ребята, помогите с кодом немного.

<div class="floating fixed">
Плавающий блок!<br>Он плавает и ему наплевать на высоту страницы...
<br>Он плавает по месту и никуда не уедет...
</div>
.fixed {
    top: 10px;
    z-index: 9999;
    position: fixed;
}

.floating {
    background: #1C1C1C none repeat scroll 0% 0%;
    color: #FFF;
    font: 14px Tahoma;
    padding: 10px;
    height: 250px;
    width: 250px;
}

И jquery:

$(document).ready(function() {
	//Tooltips
	$(".tip_trigger").hover(function(){
		tip = $(this).find('.tip');
		tip.show(); //Show tooltip
	}, function() {
		tip.hide(); //Hide tooltip		  
	}).mousemove(function(e) {
		var mousex = e.pageX + 20; //Get X coodrinates
		var mousey = e.pageY + 20; //Get Y coordinates
		var tipWidth = tip.width(); //Find width of tooltip
		var tipHeight = tip.height(); //Find height of tooltip
		
		//Distance of element from the right edge of viewport
		var tipVisX = $(window).width() - (mousex + tipWidth);
		//Distance of element from the bottom of viewport
		var tipVisY = $(window).height() - (mousey + tipHeight);
		  
		if ( tipVisX < 20 ) { //If tooltip exceeds the X coordinate of viewport
			mousex = e.pageX - tipWidth - 20;
		} if ( tipVisY < 20 ) { //If tooltip exceeds the Y coordinate of viewport
			mousey = e.pageY - tipHeight - 20;
		} 
		tip.css({  top: mousey, left: mousex });
	});
});

Все работает отлично. Но когда начинаешь скролить страницу чуть вниз, то блок делает небольшой рывок и затем добавляется отступ, соответственно также и когда скролиш почти до верха, также резко становится на место. Хотелось бы добавить анимацию его движения. Нужно ли переписывать весь код для этого? Или достаточно изменить несколько строк кода?

Ссылка на сообщение
Поделиться на других сайтах
22 часа назад, prostreet сказал:

Или достаточно изменить несколько строк кода?

скорее всего, НО, в firefox`е работает хорошо, ни каких рывков и прыжков...

  • Поддерживаю 1
Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас
×
×
  • Создать...