我似乎无法从这段代码中获取我需要的东西并让它为自己工作,希望有人能提供帮助。
我不能使用 Jquery UI 并且使悬停比他们需要的要困难得多。我有一个精灵,我需要淡入和淡出悬停。.css() 不允许淡入淡出,它是一个被 bg 位置调用的精灵
我的计划是在 mouseenter/leave 或 hover 上添加/删除一个类。这部分很容易,获得缓动效果则不然。这是他们的代码。我将如何使用这样的东西来添加和删除一个类,以便我可以淡入它来伪造动画/定时悬停?
$(".nav").children("li").each(function() {
var current = "nav current-" + ($(this).attr("class"));
var parentClass = $(".nav").attr("class");
if (parentClass != current) {
$(this).children("a").css({backgroundImage:"none"});
}
});
// create events for each nav item
attachNavEvents(".nav", "home");
attachNavEvents(".nav", "about");
attachNavEvents(".nav", "services");
attachNavEvents(".nav", "contact");
function attachNavEvents(parent, myClass) {
$(parent + " ." + myClass).mouseover(function() {
$(this).append('<div class="nav-' + myClass + '"></div>');
$("div.nav-" + myClass).css({display:"none"}).fadeIn(200);
}).mouseout(function() {
// fade out & destroy pseudo-link
$("div.nav-" + myClass).fadeOut(200, function() {
$(this).remove();
});
});
}
我正在使用的 css 只是这样的:
.btn_up {
width: 161px;
height: 40px;
background-position: -131px -310px;
margin:10px auto;
}
.btn_uphover{
background-position: -292px -310px !important;
-moz-opacity:0;
filter:alpha(opacity=0);
opacity:0;
}