Наступление события без наведения мыши
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); |
и вот ты думаешь нам делать нечего как его приводить в нормальный вид, а потом еще думать как помочь??
приведи в нормальный вид, я уже писал (и не только я) по этому поводу: http://javascript.ru/forum/misc/9459...tml#post262341 |
Цитата:
Готов заплатить |
Цитата:
|
а ответить не гож?)
добавь что ли на $(document).ready(function(){ вот сюда пихай то, что должно делаться при загрузке страницы }); |
п.с. ну вот лучше на такой код смотреть то...
>>>Возможно выполнить без 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(); ничего сложного)) |
а проблем с локальным объявлением функции не будет?
|
если так боитесь за видимость, то переменную можно объявить вообще за пределами jquery, а в jquery присвоить ей функцию. А вообще имхо не должно..
попробуйте, если будет ругаться, пишите.. будем вместе разбираться |
Никаких скриптов:
<!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> |
Цитата:
|
Часовой пояс GMT +3, время: 04:43. |