<!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=gb2312" />
<style type="text/css">
#bg { background-color: rgb(102, 132, 228);}
</style>
<title></title>
<!--<link href="css/nicenav.css" target="_blank" rel="external nofollow" rel="stylesheet" />-->
<!--<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>-->
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="js/jquery.nicenav.js" type="text/javascript"></script>
<style type="text/css">
*{margin: 0;padding: 0;}
#container { width: 945px; height: 74px; overflow: hidden; margin: auto; font-family: Microsoft YaHei,Segoe UI,Tahoma,Arial,Verdana,sans-serif; }
#container ul { height: 74px;}
#container li { display: block; float: left; width: 133px; height: 74px; background: url(../images/transparent.png); line-height: 32px; padding-right: 2px; line-height: 74px; list-style: none; }
#container li a { color: #fff; text-decoration: none; display: block; position: relative; background: url(../images/black.png); width: 123px; height: 74px; padding-right: 10px; font-size: 14px; font-weight: bold; text-align: right; }
#container li a:hover { background: #222; }
#container li a span { display: block; position: absolute; left: 10px; top: 0; font-weight: normal; font-size: 10px; -webkit-text-size-adjust: none; opacity: 0.6; filter: alpha(opacity=60); }
#buy { position: absolute; width: 133px; height: 2px; background: #e9d008; bottom: 0px; left: 0; }
</style>
</head>
<body>
<div id="bg">
<div id="container">
<ul id="nav" style="position: relative;">
<li><a href="http://sc.chinaz.com/" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank">品锟斤拷<span>BRAND</span></a></li>
<li><a href="http://sc.chinaz.com/" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank">锟脚匡拷<span>OVERVIEW</span></a></li>
<li><a href="http://sc.chinaz.com/" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank">锟斤拷值<span>WORTH</span></a></li>
<li><a href="http://sc.chinaz.com/" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank">锟斤拷锟斤拷<span>SUPPORT</span></a></li>
<li><a href="http://sc.chinaz.com/" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank">锟斤拷锟斤拷<span>UNIT</span></a></li>
<li><a href="http://sc.chinaz.com/" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank">锟斤拷装<span>HARDCOVER</span></a></li>
<li><a href="http://sc.chinaz.com/" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank">锟斤拷态<span>NEWS</span></a></li>
<div id="buy"></div>
</ul>
</div>
</div>
<hr>
<!--<script type="text/javascript">
$.nicenav(300);
</script>-->
<script type="text/javascript">
$(function(){
var lis = $('#nav>li'),
h = $('#buy')
$(lis).hover(function(){
var index =$(this).index();
console.log($(this).offset())
var offl=$(this).offset().left-$(this).width()
$(h).stop().animate({
'left': offl
},300)
},function(){
$(h).stop().animate({
'left': $(this).offset().left-$(this).width()
}, 400);
})
})
</script>
</body>
</html>
?????界?跺?绠??? 涔?杩???璁板?涓?锛?
??浠舵?瑰?
; (function ($) {
$.extend({
'nicenav': function (con) {
con = typeof con === 'number' ? con : 400;
var $lis = $('#nav>li'), $h = $('#buoy')
$lis.hover(function () {
$h.stop().animate({
'left': $(this).offsetParent().context.offsetLeft //context ??.10涓?宸茬?寮??? }, con);
console.log($(this))
console.log($(this).offsetParent())
console.log($(this).offsetParent().context)
}, function () {
// $h.stop().animate({
'left': '0'
}, con);
})
}
});
}(jQuery));
??杩?浜?浜?寰??垮?缃?绔?甯歌???灏????斤?涓?瑕?瑙?寰?寰?绠???锛????惰??ㄦ?剁?存??opy 锛?杩??????堕?寸??
?
杞?杞戒?:https://www.cnblogs.com/qq735675958/p/8330177.html
![nodejs微信开发---授权登录+获取用户信息微信网页授权[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)