最近在做个wp模板,不过总是出现各种问题

Posted by zhang on

最近在上课,闲下来的时候就做做WP模板。抄袭淘宝ued团队的博客。结果就遇到了这么一码事,一直也没有解决。

本来啊,效果应该是这样:

QQ截图20140818103311.png

字的背景是一个可以随鼠标移动的条,类似于一个hover的伪类,但是使用js来实现的。

但是我鼓捣完确实这个样子滴

QQ截图20140818103300.png

字底下的条比理论低了12px。

另外我加上了个判断 令负责底下这个条位置的值如果等于12则强行改为0

则鼠标移动到这个条上后,位置就正常。。不然效果还不能实现。。。

QQ图片20140818104106.gif

再插入我找到的代码

menuHover: function(b) {
            var c = this;
			if (b) {
                var d = c.navNode.one("#menu-primary").offset().top,
                e = b.offset().top - d;
				if(e == 12)
				{ e = 0;}
				else e = e;
                "none" == c.labelNode.css("display") ? c.labelNode.css("top", b).show() : (a.Anim.stop(c.labelNode, !1, !1, "topAnim"), new a.Anim(c.labelNode, {
                    top: e
                },
                {
                    duration: .2,
                    easing: "ease-out",
                    queue: "topAnim",
                    useTransition: !0
                }).run())
            } else c.labelNode.fadeOut(.3)
        },

其中:



if(e == 12)
{ e = 0;}
else e = e;

这个是我自己写的。

整个的js文件在https://code.csdn.net/snippets/452843/e0c67e2ed33642c9acd55492bc95af6cdf8cddc4

#About Me

张小璋,野蛮生长成世界500强企业供应链金融产品经理的法语毕业生。微信公众号:张小璋碎碎念(ID: SylvainZhang )。
一直在互联网金融公司从事产品经理工作并负责互联网金融产品线,深耕互联网金融和区块链领域。「PMCAFF」、「人人都是产品经理」专栏作家、「PmTalk」签约作家。