Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.07.2013, 14:19
Новичок на форуме
Отправить личное сообщение для Дмирий Посмотреть профиль Найти все сообщения от Дмирий
 
Регистрация: 23.07.2013
Сообщений: 3

Наступление события без наведения мыши
P.S. Столкнулся с js сегодня первый раз. Cпасибо за минусы, вот как вы к новичкам))

Имеем скрипт, который срабатывает при наведении. Поднимает div c текстом. И убирает, как убираем мышь.

Возможно выполнить без mouseenter, а сразу при загрузке страницы?
c.bind(
      {
       mouseenter:function()
       }



(function(d)
	{
	var e=function(){};
	d.extend(e.prototype,
		{
		name:"spotlight",options:{effect:"fade",duration:300,transition:"swing",cls:"spotlight",overlaySelector:".overlay",overlayDefault:"overlay-default"},initialize:function(c,a)
			{
			a=d.extend({},this.options,a,c.data());
			c.attr("data-spotlight")&&d.each(c.attr("data-spotlight").split(";"),
			function(b,c)
				{
				var d=c.match(/\s*([A-Z_]*?)\s*:\s*(.+)\s*/i);
				d&&(a[d[1]]=d[2])
				});
				var b=c.children(a.overlaySelector).first();
				b.length||(b=d("<div>").addClass(a.overlayDefault).appendTo(c));

				b.css(
					{
					position:"absolute",visibility:"hidden",display:"block"
					}).wrapInner("<div>");
				c.css(
					{
					position:"relative",overflow:"hidden"
					}).addClass(a.cls);
				c.bind(
					{
					mouseenter:function()
						{
						b.stop().css({visibility:"visible",width:c.width(),height:"top"==a.effect||"bottom"==a.effect?"auto":c.height()});
						switch(a.effect)
							{
							case "right":b.css({right:-1*b.width(),top:0,bottom:0}).animate({right:0},a.duration,a.transition);
							break;case "left":b.css({left:-1*b.width(),top:0,bottom:0}).animate({left:0},a.duration,a.transition);
							break;case "top":b.css({left:0,top:-1*b.height()}).animate({top:0},a.duration,a.transition);
							break;case "bottom":b.css({left:0,bottom:35-1*b.height()}).animate({bottom:0},a.duration,a.transition);
							break;default:b.show().css({opacity:0,top:0,left:0}).animate({opacity:1},a.duration,a.transition,
							function()
								{
								d.support.opacity||(b.get(0).filter="",b.attr("style",(""+b.attr("style")).replace(/alpha\(opacity=([\d.]+)\)/i,"")))
								})
							}
						},
					mouseleave:function()
						{
						b.stop();
						switch(a.effect)
							{
							case "right":b.animate({right:-1*b.width()},a.duration,a.transition);
							break;case "left":b.animate({left:-1*b.width()},a.duration,a.transition);
							break;case "top":b.animate({top:-1*b.height()},a.duration,a.transition);
							break;case "bottom":b.animate({bottom:35-1*b.height()},a.duration,a.transition);
							break;default:b.animate({opacity:0},a.duration,a.transition,
							function(){b.hide()})
							}
						}
					})
			}
		});d.fn[e.prototype.name]=function(){var c=arguments,a=c[0]?c[0]:null;
			return this.each(function(){var b=d(this);
				if(e.prototype[a]&&b.data(e.prototype.name)&&
				"initialize"!=a)b.data(e.prototype.name)[a].apply(b.data(e.prototype.name),Array.prototype.slice.call(c,1));
				else if(!a||d.isPlainObject(a))
				{
				var f=new e;e.prototype.initialize&&f.initialize.apply(f,d.merge([b],c));b.data(e.prototype.name,f)
				}
				else d.error("Method "+a+" does not exist on jQuery."+e.name)})}

})(jQuery);

Последний раз редактировалось Дмирий, 23.07.2013 в 16:08.
Ответить с цитированием
  #2 (permalink)  
Старый 23.07.2013, 14:32
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

и вот ты думаешь нам делать нечего как его приводить в нормальный вид, а потом еще думать как помочь??
приведи в нормальный вид, я уже писал (и не только я) по этому поводу:
ЧаВО - часто задаваемые вопросы (faq)
Ответить с цитированием
  #3 (permalink)  
Старый 23.07.2013, 14:39
Новичок на форуме
Отправить личное сообщение для Дмирий Посмотреть профиль Найти все сообщения от Дмирий
 
Регистрация: 23.07.2013
Сообщений: 3

Сообщение от skrudjmakdak Посмотреть сообщение
и вот ты думаешь нам делать нечего как его приводить в нормальный вид, а потом еще думать как помочь??
приведи в нормальный вид, я уже писал (и не только я) по этому поводу:
ЧаВО - часто задаваемые вопросы (faq)
я первый день на форуме, в js ни бум-бум.
Готов заплатить
Ответить с цитированием
  #4 (permalink)  
Старый 23.07.2013, 14:53
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

Сообщение от Дмирий Посмотреть сообщение
я первый день на форуме, в js ни бум-бум.
Готов заплатить
тогда вам в другой раздел. раздел работа))
Ответить с цитированием
  #5 (permalink)  
Старый 24.07.2013, 13:34
Новичок на форуме
Отправить личное сообщение для AlexChi Посмотреть профиль Найти все сообщения от AlexChi
 
Регистрация: 24.07.2013
Сообщений: 5

а ответить не гож?)
добавь что ли на
$(document).ready(function(){
вот сюда пихай то, что должно делаться при загрузке страницы
});
Ответить с цитированием
  #6 (permalink)  
Старый 24.07.2013, 13:51
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

п.с. ну вот лучше на такой код смотреть то...

>>>Возможно выполнить без mouseenter, а сразу при загрузке страницы?
конечно можно.

вынесите эту функцию и присвойте ей имя, примерно так:
var func_mouseenter = function()
	{
	b.stop().css({visibility:"visible",width:c.width(),height:"top"==a.effect||"bottom"==a.effect?"auto":c.height()});
	switch(a.effect)
	...
		}
	}


а когда биндите, то делайте так:
...
c.bind(
	{
	mouseenter: func_mouseenter,
	mouseleave:function()
...


и при загрузке вызываем эту функцию:
func_mouseenter();


ничего сложного))
Ответить с цитированием
  #7 (permalink)  
Старый 24.07.2013, 14:02
Новичок на форуме
Отправить личное сообщение для AlexChi Посмотреть профиль Найти все сообщения от AlexChi
 
Регистрация: 24.07.2013
Сообщений: 5

а проблем с локальным объявлением функции не будет?
Ответить с цитированием
  #8 (permalink)  
Старый 24.07.2013, 14:40
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

если так боитесь за видимость, то переменную можно объявить вообще за пределами jquery, а в jquery присвоить ей функцию. А вообще имхо не должно..
попробуйте, если будет ругаться, пишите.. будем вместе разбираться
Ответить с цитированием
  #9 (permalink)  
Старый 24.07.2013, 16:38
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

Никаких скриптов:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style type="text/css">
.myDiv {
	background: #777;
	border: 1px silid #CCC;
	border-radius: 20px;
	color: #DDD;
	font-size: 18pt;
	font-weight: bold;
	height: 70px;
	left: 50%;
	margin-left: -150px;
	padding-top: 30px;
	position: fixed;
	text-align: center;
	top: 100px;
	transition: top 0.5s;
	-moz-transition: top 0.5s;
	-o-transition: top 0.5s;
	-webkit-transition: top 0.5s;
	width: 300px;
}
.myDiv:hover {
	cursor: pointer;
	top: 20px;
}
</style>
</head>

<body>
<div class="myDiv">Наведи на меня!</div>
</body>
</html>
Ответить с цитированием
  #10 (permalink)  
Старый 24.07.2013, 16:47
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

Сообщение от Ruslan_xDD Посмотреть сообщение
Никаких скриптов
гм.. всеми любимый ие остался в стороне)))
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
эмуляция события resize для элемента без использования фрейма (scroll-based?) danik.js Events/DOM/Window 1 08.04.2013 13:58
События: движение мыши при нажатой клавише bayah Общие вопросы Javascript 11 18.12.2012 10:18
Останавливаем обработку события OlegDegtev jQuery 3 07.08.2012 14:06
Немного Юмора - Гуртовщики Мыши antonM Оффтопик 12 23.03.2012 20:04
Вместо наведения мыши, нужен клик Jaroslav jQuery 4 24.10.2011 10:50