Показать сообщение отдельно
  #1 (permalink)  
Старый 16.02.2013, 03:36
Аватар для Zuenf
Кандидат Javascript-наук
Отправить личное сообщение для Zuenf Посмотреть профиль Найти все сообщения от Zuenf
 
Регистрация: 27.01.2012
Сообщений: 134

Нестандартные всплывающие подсказки. Нужна конструктивная критика!
Привет всем! Я пока не очень хорошо знаю JavaScript, и поэтому прошу вас прокритиковаться от души
Написал код который заменяет все стандартные всплывающие подсказки на нестандартные: при наведении берется текст из атрибута title, и вставляется в блок, который тут же появляется под курсором.
Вот код js:
$(document).ready(function(){
	gtitle();
});

var mouseX = 0;
var mouseY = 0;

function gtitle(){
	$('*').mouseover(function(){
		if($(this).attr('title')){
			//Из title в блок gtitle
			var gtitletext = $(this).attr('title');
			$('#gtitle').empty();
			$('#gtitle').append(gtitletext);
			$(this).removeAttr('title');//Удаляет арибут title, чтобы не вылезал стандартный title
			viewGTitle();
			$(this).mouseout(function(){
				hideGTitle()
				//Обратно из блока gtitle в title 
				$(this).attr('title', gtitletext);
			});
		}
	});
	$(document).mousemove(function(e){//Запоминает координаты мыши
		mouseX = e.pageX;
		mouseY = e.pageY;
	});
}

function viewGTitle(){//функция для появления блока gtitle в правильном месте
	$('#gtitle').css({
		"position":"absolute",
		"top":mouseY-4-$('#gtitle').height()-parseInt($('#gtitle').css("padding-top"))-parseInt($('#gtitle').css("padding-bottom")),
		"left":mouseX+4
	});
	$('#gtitle').stop();
	$('#gtitle').css("display", "block")
	$('#gtitle').animate({
		opacity:1
	}, 400);
}

function hideGTitle(){
	$('#gtitle').stop();
	$('#gtitle').animate({
		opacity:0
	}, 400, function(){$('#gtitle').css("display", "none");});
}

Мне интересно, что бы вы сделали по другому, и как именно?
Изображения:
Тип файла: jpg gtitle.jpg (33.1 Кб, 33 просмотров)
Ответить с цитированием