经验分享程序开发文档资料数据资源其它资源

jquery光标跟随360导航特效代码

版权：原创 更新时间：1年以上
[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是 jquery光标跟随360导航特效代码 的示例演示效果:

当前平台(PC电脑)
  • 平台:
整屏预览

部分效果截图:

jquery光标跟随360导航特效代码

HTML代码(index.html):

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<link href="css/extend_all.css" rel="stylesheet" charset="gb2312"/>
</head>
<body>
<div class="head-warp">
  <div class="head">

    <div class="nav-box">
      <ul>
        <li><a href="http://www.baidu.com/">首页</a></li>
        <li><a href="http://www.baidu.com">实验室</a></li>
        <li class="cur"><a href="http://www.baidu.com">扩展</a></li>
        <li><a href="http://www.baidu.com/">皮肤</a></li>
        <li><a href="http://www.baidu.com">日志</a></li>
        <li><a href="http://www.baidu.com">帮助</a></li>
        <li><a href="http://www.baidu.com" target="_blank">论坛</a></li>
      </ul>
      <div class="nav-line"></div>
    </div>
  </div>
</div>
<script src="js/jquery.js"></script>
<script src="js/main.js"></script>
</body>
</html>

JS代码(main.js):

(function($){
	$(function(){
	nav();
	bnrSilder();
	//sideSlider();
	helpToggle();
	systole();
	slideImg();
	downM();
	ExtMutual();
	//slides("#slides",".slides");
	skinMutual();
}
);
	function nav(){
	var $liCur = $(".nav-box ul li.cur"),curP = $liCur.position().left,curW = $liCur.outerWidth(true),$slider = $(".nav-line"),$targetEle = $(".nav-box ul li:not('.last') a"),$navBox = $(".nav-box");
	$slider.stop(true,true).animate({
	"left":curP,"width":curW}
);
	$targetEle.mouseenter(function(){
	var $_parent = $(this).parent(),_width = $_parent.outerWidth(true),posL = $_parent.position().left;
	$slider.stop(true,true).animate({
	"left":posL,"width":_width}
,"fast");
}
);
	$navBox.mouseleave(function(cur,wid){
	cur = curP;
	wid = curW;
	$slider.stop(true,true).animate({
	"left":cur,"width":wid}
,"fast");
}
);
}
;
	function bnrSilder(){
	if( !$("#head").length && !$("#bnr").length ){
	return;
}
(function(){
	var sstag = document.createElement('script');
	sstag.type = 'text/javascript';
	sstag.async = true;
	sstag.src = 'script/SmoothScroll.js';
	var s = document.getElementsByTagName('script')[0];
	s.parentNode.insertBefore(sstag,s);
}
)();
	$(window).scroll(function(){
	var bTop = $(this).scrollTop();
	$('.bnr-box').css({
	'margin-top':-bTop*0.48}
);
	$('.bnr-txt').css({
	'margin-top':-bTop*0.68}
);
	$('.bnr-btn').css({
	'margin-top':-bTop*0.68}
);
	$('.warper').css({
	"background-position":"50% "+bTop*0.2+"px"}
);
	if(bTop*1.5<300){
	$(".txt-warp").css({
	'margin-top':-bTop*1.5}
);
	$(".txt-nav-warp").removeAttr("style");
}
else{
	$(".txt-warp").css({
	'margin-top':-240}
);
	$(".txt-nav-warp").css({
	"position":"fixed","top":0,"left":0}
);
	$(".cont").css({
	"padding-top":"84px"}
);
}
}
);
}
;
	function sideSlider(){
	if( !$(".help-side dl").length ){
	return false;
}
var $aCur = $(".help-side dl").find(".cur a"),$targetA = $(".help-side dl dd a"),$sideSilder = $(".side-slider"),curT = $aCur.position().top - 3;
	$sideSilder.stop(true,true).animate({
	"top":curT}
);
	$targetA.mouseenter(function(){
	var posT = $(this).position().top-3;
	$sideSilder.stop(true,true).animate({
	"top":posT}
,240);
}
).parents(".help-side").mouseleave(function(_curT){
	_curT = curT$sideSilder.stop(true,true).animate({
	"top":_curT}
);
}
);
}
;
	function helpToggle(){
	if( !$(".help-cont dl dt a").length ){
	return;
}
var $targetEle = $(".help-cont dl dt a");
	$targetEle.toggle(function(){
	$(this).parent().css({
	"background-position":"0 -20px"}
).siblings().slideDown();
	return false;
}
,function(){
	$(this).parent().removeAttr("style").siblings().slideUp();
	return false;
}
);
}
;
	function systole(){
	if( !$(".history").length){
	return;
}
var $warpEle = $(".history-date"),$targetA = $warpEle.find("h2 a,ul li dl dt a"),parentH,eleTop= [];
	parentH = $warpEle.parent().height();
	$warpEle.parent().css({
	"height":59}
);
	setTimeout(function(){
	$warpEle.find("ul").children(":not('h2:first')").each(function(idx){
	eleTop.push($(this).position().top);
	$(this).css({
	"margin-top":-eleTop[idx]}
).children().hide();
}
).animate({
	"margin-top":0}
,1600).children().fadeIn();
	$warpEle.parent().animate({
	"height":parentH}
,2600);
	$warpEle.find("ul").children(":not('h2:first')").addClass("bounceInDown").css({
	"-webkit-animation-duration":"2s","-webkit-animation-delay":"0","-webkit-animation-timing-function":"ease","-webkit-animation-fill-mode":"both"}
).end().children("h2").css({
	"position":"relative"}
);
}
,600);
	$targetA.click(function(){
	$(this).parent().css({
	"position":"relative"}
);
	$(this).parent().siblings().slideToggle();
	$warpEle.parent().removeAttr("style");
	return false;
}
);
}
;
	function slideImg(){
	if( !$(".tab-img").length && !$(".tab-cont").length ){
	return false;
}
var $tabImg = $(".tab-img"),$slideImg = $tabImg.find(".img-slide"),$slideBox = $(".tab-img-slide");
	$tabBtn = $(".tab-img-btn").find("a"),$tabContBox = $(".tab-cont-box");
	$tabBtn.toggle(function(){
	$(this).removeClass("pulse").addClass("btn flipInY");
	$slideImg.last().css({
	"left":$tabImg.width()}
).show();
	$tabContBox.last().fadeIn("slow").end().first().hide();
	$slideBox.stop(true,true).animate({
	"margin-left":-$tabImg.width()}
,400,function(){
	$tabBtn.delay(1000).removeClass("flipInY");
	$slideImg.first().hide().end().last().css({
	"left":0}
);
	;
	$(this).css({
	"margin-left":0}
);
}
);
	return false;
}
,function(){
	$(this).removeClass("flipInY pulse").addClass("flipInY").removeClass("btn");
	$slideImg.first().css({
	"left":$tabImg.width()}
).show();
	$tabContBox.first().fadeIn("slow").end().last().hide();
	$slideBox.stop(true,true).animate({
	"margin-left":-$tabImg.width()}
,400,function(){
	$tabBtn.delay(1000).removeClass("flipInY");
	$slideImg.last().hide().end().first().css({
	"left":0}
);
	$(this).css({
	"margin-left":0}
);
}
);
	return false;
}
).parent().hover(function(){
	$(this).children().addClass("pulse");
}
,function(){
	$(this).children().removeClass("pulse");
}
);
}
;
	function downM(){
	if( !$(".navi").length ){
	return false;
}
var $targetBtn = $(".pos-box > span"),targetW;
	$targetBtn.click(function(){
	var posbox=$(this).parents(".pos-box");
	posbox.toggleClass("hover");
	$(this).parents('td:first').prev().has('input').find('.pos-box').removeClass('hover');
	targetW = $(this).parents("td").width()+1;
	$(this).siblings(".search-box").find("span").width(targetW);
}
).parent().mouseleave(function(){
	var posbox=$(this);
	if(!posbox.has('form').length){
	posbox.parents("td").children().removeClass("hover");
}
}
).toggle(function(e){
	$(this).find('.search-box input.sch-txt').focus();
}
,function(e){
}
);
	$('.more-btn').click(function(e){
	console.log('more-btn.click',e)e.stopPropagation();
}
);
}
;
	function ExtMutual(){
	var $extList = $(".extend-list li"),$extBtn = $(".ext-btn");
	$extList.delay(1000).hover(function(){
	//$(this).find(".ext-logo").stop(true,true).delay(300).animate({
	"margin-top":-95}
,250);
}
,function(){
	//$(this).find(".ext-logo").stop(true,true).animate({
	"margin-top":0}
,250);
}
);
	$extList.each(function(idx){
	$(this).click(function(){
	//dialog("#dialog01");
}
);
}
);
	$extBtn.each(function(index){
	$(this).click(function(e){
	//e.stopPropagation();
}
);
}
);
}
;
	function skinMutual(){
	var $skinList = $(".skin-lists li"),$aTarget = $skinList.find("p a");
	$skinList.each(function(idx){
	$(this).click(function(){
	dialog("#dialog02");
}
);
}
);
	$aTarget.click(function(e){
	e.stopPropagation();
}
);
}
;
	window.slides=slides2;
	function slides2($indexs,$pics){
	console.log('slides');
	clearInterval(slides.t);
	var len = $pics.length,cur = 0,zIdex = 2,t,tmpArr = [],w = $pics.width(),effect ={
}
;
	$indexs.eq(cur).addClass("current");
	$pics.parent().css({
	"width":3*w,"left":-w}
);
	$pics.hide();
	$pics.css({
	"left":w}
).eq(cur).show().end().eq(cur+1).css({
	"left":2*w}
).show();
	function nextCur(){
	//debugger;
	$pics.hide().eq(cur).show();
	//console.log(cur,len,$pics.parent().css('left'));
	cur = (cur+1) % len;
	//console.log('nextCur',len,cur);
	$indexs.removeClass("current").eq(cur).addClass("current");
	$pics.css({
	"left":w,"z-index":0}
).eq(cur == len ? 0:cur).show().css({
	"left":2*w,"z-index":zIdex}
).end().eq(cur-1<0?len-1:cur-1).show().css({
	"left":w,"z-index":0}
);
	//.eq(cur-1<0?len-1:cur-1).show();
	$pics.parent().stop(true,true).animate({
	"left":-2*w}
,function(){
	$(this).css({
	"left":-w}
);
	//console.log('cur:',cur);
	$pics.eq(cur).show().css({
	left:w}
)}
);
}
;
	window.nextCur=nextCur;
	window.prevCur=prevCur;
	function prevCur(){
	console.log('prevCur',len);
	cur = (cur+1) % len;
	$indexs.removeClass("current").eq(cur).addClass("current");
	$pics.hide().css({
	"left":w,"z-index":0}
).eq(cur-1 == -1 ? len-1:cur-1).show().css({
	"left":0}
).end().eq(cur).show().css({
	"left":w,"z-index":zIdex}
);
	$pics.parent().stop(true,true).animate({
	"left":0}
,function(){
	$(this).css({
	"left":-w}
);
}
);
}
;
	$indexs.find("a").each(function(idx){
	$(this).click(function(){
	var thisIdx = $indexs.find('.current').index();
	cur = idx -1;
	if( idx == thisIdx ){
	return;
}
idx < thisIdx ? prevCur():nextCur();
}
);
}
);
	$indexs.hover(function(){
	clearInterval(slides.t);
}
,function(){
	if(len>1){
	clearInterval(slides.t);
	slides.t = setInterval(function(){
	//slides.t = setTimeout(function(){
	nextCur();
}
,3000)}
}
).trigger("mouseleave");
}
;
	function slides(eleId,targetEle){
	console.log('slides');
	clearInterval(slides.t);
	if(!eleId && !targetEle){
	return false;
}
var len = $(eleId).find(targetEle).length,cur = 0,zIdex = 2,t,tmpArr = [],w = $(eleId).find(targetEle).width(),effect ={
}
;
	for(var i = 0;
	i < len;
	i+=1){
	tmpArr.push("<li><a href='#nogo' hideFocus>"+i+"</a></li>");
}
$("<ul class='pagination' />").html(tmpArr.join("")).appendTo(eleId);
	$(".pagination li").eq(cur).addClass("current");
	$(eleId).find(targetEle).parent().css({
	"width":3*w,"left":-w}
);
	$(eleId).find(targetEle).hide();
	$(eleId).find(targetEle).css({
	"left":w}
).eq(cur).show().end().eq(cur+1).css({
	"left":2*w}
).show();
	function nextCur(){
	console.log('nextCur',len);
	cur = (cur+1) % len;
	$(".pagination li").removeClass("current").eq(cur).addClass("current");
	$(eleId).find(targetEle).hide().css({
	"left":w,"z-index":0}
).eq(cur+1 == len ? 0:cur+1).show().css({
	"left":2*w}
).end().eq(cur).show().css({
	"left":w,"z-index":zIdex}
);
	$(eleId).find(targetEle).parent().stop(true,true).animate({
	"left":-2*w}
,function(){
	$(this).css({
	"left":-w}
);
}
);
}
;
	function prevCur(){
	console.log('prevCur',len);
	cur = (cur+1) % len;
	$(".pagination li").removeClass("current").eq(cur).addClass("current");
	$(eleId).find(targetEle).hide().css({
	"left":w,"z-index":0}
).eq(cur-1 == -1 ? len-1:cur-1).show().css({
	"left":0}
).end().eq(cur).show().css({
	"left":w,"z-index":zIdex}
);
	$(eleId).find(targetEle).parent().stop(true,true).animate({
	"left":0}
,function(){
	$(this).css({
	"left":-w}
);
}
);
}
;
	$(".pagination li a").each(function(idx){
	$(this).click(function(){
	var thisIdx = $(".pagination li.current").index();
	cur = idx -1;
	if( idx == thisIdx ){
	return;
}
idx < thisIdx ? prevCur():nextCur();
}
);
}
);
	$(eleId).hover(function(){
	clearInterval(slides.t);
}
,function(){
	if(len>1){
	clearInterval(slides.t);
	slides.t = setInterval(function(){
	nextCur();
}
,3000)}
}
).trigger("mouseleave");
}
;
	window.dialog=dialog;
	function dialog(id){
	if( !$(".dialog-bg").length && !$(id).length){
	return;
}
var $doc = $("body",document),$dialogWarp = $(".dialog-bg"),$dialog = $(id),$dialogCont = $(".dialog-cont"),$clsBtn = $("#closed-btn"),maxH = $doc.height(),posL = 425,posT = $(".dialog-cont").height()/2,w = 850,h = $(".dialog-cont").height();
	//$dialogWarp.fadeOut();
	$dialogCont.hide();
	$clsBtn.hide();
	//$doc.css({
	"overflow":"hidden","margin-right":17}
);
	$dialogWarp.css({
	"height":maxH}
).show();
	$dialog.delay(200).show().stop(true,true).animate({
	"width":w,"height":h,"margin-left":-posL,"margin-top":-posT}
,"fast","swing",function(){
	$dialogCont.show();
	$clsBtn.show();
}
);
	$clsBtn.click(function(){
	$dialog.removeAttr("style");
	$doc.removeAttr("style");
	$dialogWarp.removeAttr("style").hide();
}
);
	$dialogWarp.click(function(){
	$dialog.removeAttr("style");
	$doc.removeAttr("style");
	$dialogWarp.removeAttr("style").hide();
}
);
}
;
}
)(jQuery);
	function srollList(id,srlNum){
	if( id == ''){
	return;
}
var $prev = $("#prev"),$next = $("#next"),$btnList = $(".btn-list"),$ul = $btnList.find("ul"),$li = $btnList.find("li"),$clsBtn = $("#closed-btn"),maxLen = $li.length,liW = $li.outerWidth(true),next = "-=",prev = "+=",page = 1,i = srlNum,srollW = liW*i,filledW = srollW-((i - (maxLen%i))*liW) == 0 ? srollW:srollW-((i - (maxLen%i))*liW),posL;
	$next.click(function(){
	var page_count = Math.ceil(maxLen/i);
	if( page == page_count){
	return;
}
page == page_count-1 && filledW > 0 ? srollW = filledW:srollW = $li.outerWidth(true)*i;
	move(next);
	page++;
	console.log(page);
}
);
	$prev.click(function(){
	var page_count = Math.ceil(maxLen/i);
	if( page == 1){
	return;
}
page == page_count?srollW = filledW:srollW = $li.outerWidth(true)*i;
	move(prev);
	page--;
}
);
	$li.click(function(){
	$(this).addClass("cur").siblings().removeClass("cur");
}
);
	function move(path){
	$ul.stop(true,true).animate({
	"margin-left":path+srollW}
,300);
}
;
	$clsBtn.click(function(){
	page=1;
	$ul.removeAttr("style");
}
);
}
;

CSS代码(extend_all.css):

/** @date 2012-05-04*/
body,p,form,input,textarea,ul,li,h1,h2,h3,h4,dl,dt,dd,table,td,th{margin:0;padding:0;}
table,td,th{border-collapse:collapse;}
ul,li{list-style:none;}
h1,h2,h3,h4{font-size:100%;}
img,input,textarea{vertical-align:middle;border:0;}
a{text-decoration:none;color:#999;outline:none;}
a:hover{text-decoration:underline;}
body{font:12px/1.5 "微软雅黑","tahoma",Verdana,Geneva,sans-serif;color:#666;position:relative;}
.clearfix:after{content:" ";display:block;height:0;clear:both;visibility:hidden;}
.clearfix{zoom:1;}
.fl{float:left;}
.fr{float:right;}
/*.public*/
.main{margin:0 auto;width:980px;}
.footer{height:;background:#fafafa;border-top:1px solid #f3f3f3;padding:28px 0 40px;}
.footer p{line-height:23px;color:#c6c6c6;text-align:center;}
/*head*/
.head-warp{background:#fbfbfb url(http://p3.qhimg.com/d/360browser/20120928/navBg.gif) repeat-x 0 bottom;}
.head-warp .head{width:980px;margin:0 auto;background-image:none;}
.head{height:49px;background:url(http://p3.qhimg.com/d/360browser/20120928/line01.png) no-repeat 50% bottom;padding:14px 0 1px;}
.head h1{background:url(http://p3.qhimg.com/d/360browser/20120928/logo.png) no-repeat;height:42px;width:178px;float:left;line-height:10em;overflow:hidden;}
.head h1 a{display:block;width:100%;height:42px;}
.nav-box{float:right;position:relative;}
.nav-box ul{padding-top:8px;}
.nav-box ul li{float:left;font-family:"微软雅黑";font-size:14px;padding:0 12px;height:41px;line-height:41px;}
.nav-box ul li a{color:#4b4b4b;}
.nav-box ul li a:hover{text-decoration:none;}
.nav-box ul li.last{font-family:"微软雅黑";font-size:12px;padding-top:1px;}
.nav-box ul li.last a{color:#a2a2a1;}
.nav-box .nav-line{position:absolute;left:0;bottom:0;height:2px;line-height:2px;font-size:0;width:52px;background:#35c4fd;}
/*dialog*/
.dialog-bg{position:absolute;z-index:1000;left:0;top:0;width:100%;height:100%;background:#fff;filter:alpha(opacity=70);opacity:0.7;display:none;}
.dialog{box-shadow:0 4px 16px rgba(0,0,0,0.2);background:#fff;position:fixed;left:50%;top:50%;height:1px;width:1px;margin-left:0;margin-top:0;z-index:1002;border:1px solid #e3e3e3;display:none;}
#closed-btn{background:#595959 url(http://p3.qhimg.com/d/360browser/20120928/clsBtn.gif) no-repeat 5.5px 5px;border:2px solid #fff;border-radius:20px;box-shadow:3px 0 5px rgba(0,0,0,0.2);width:20px;height:20px;overflow:hidden;color:#fff;position:absolute;right:-13px;top:-12px;text-indent:-1000em;display:none;}
#closed-btn:hover{text-decoration:none;}
.dialog-cont{overflow:hidden;height:560px;display:none;}
.dialog-head{padding:10px 0 0;margin:0 33px;border-bottom:1px solid #ebebeb;position:relative;overflow:hidden;zoom:1;}
.ext-img{height:48px;width:48px;padding:10px 10px 10px 0;}
.f-txt{margin-left:77px;}
.f-txt h2{font-size:20px;font-weight:normal;line-height:30px;margin:8px 0 6px;color:#000;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:480px;}
.star{width:61px;height:12px;background:url(http://img.360.cn/images/2008/360chrome/img/star.gif) no-repeat 0 -12px;margin:-2px 8px 0 0;}
.star span{display:block;height:12px;background:url(http://img.360.cn/images/2008/360chrome/img/star.gif) no-repeat;}
.f-infor{line-height:16px;color:#dbdbdb;margin-top:-6px;}
.f-infor a,.star{display:inline-block;*display:inline;zoom:1;vertical-align:middle;}
.f-infor a{padding-left:20px;background:url(http://p3.qhimg.com/d/360browser/20120928/wbo.png) no-repeat;height:16px;line-height:20px;overflow:hidden;margin:-2px 0 0 8px;}
.download-btn{background:url(http://p3.qhimg.com/d/360browser/20120928/btn2.png) no-repeat;box-shadow:0 2px 0 #ececec;border-radius:2px;width:157px;height:37px;position:absolute;right:0;top:28px;text-indent:-1000em;overflow:hidden;}
/**/
.tab-btn{background:#f5f5f5;border-top:1px solid #ededed;height:90px;position:relative;padding:0 53px;}
.dir-btn{position:absolute;height:90px;background:#f5f5f5 url(http://p3.qhimg.com/d/360browser/20120928/arrow.png) no-repeat 0 -65.5%;width:26px;height:56px;top:17px;border:1px solid #f5f5f5;border-radius:2px;}
.dir-btn:hover{background-color:#f0f0f0;border-color:#dfdfdf;background-color:#fcfcfc;}
.prev{left:16px;background-position:0 -38px;}
.next{right:16px;background-position:-25px -38px;}
.prev:hover{background-position:0 -65.6%;}
.next:hover{background-position:-25px -65.5%;}
.prev:active,#next:active{background-color:#f0f0f0;}
.btn-list{height:82px;position:relative;overflow:hidden;margin-top:2px;}
.btn-list ul{margin-top:4px;text-align:center;width:1000em;padding-top:8px;}
.btn-list li{display:inline;float:left;position:relative;/* height:76px;*/
 width:58px;border:1px solid #e6e6e6;margin:0 4px;cursor:pointer;}
.btn-list li img{vertical-align:top;padding:4px;border:1px solid #fff;background:#fff;width:48px;height:48px;}
.btn-list li.cur{border-color:#34c61c;}
.btn-list li.cur img{border-color:#34c61c;}
.btn-list li.cur span{border:4px solid #f5f5f5;border-bottom-color:#34c61c;line-height:0;font-size:0;position:absolute;left:50%;top:-9px;margin-left:-4px;}
/*share*/
.share{width:530px;height:490px;/*position:absolute;left:50%;top:600px;margin:0 0 0 -265px;z-index:10000;*/
}
.sharebg{width:530px;height:490px;background:#509ee4;filter:Alpha(opacity=30);opacity:0.3;}
.sharec,.resultc{width:520px;height:480px;position:absolute;top:4px;left:4px;background:#fff;overflow:hidden;border:1px solid #a9a9a9;}
.sharet{clear:both;height:40px;line-height:40px;background:url(http://w.qhimg.com/images/v2/chrome/themes/skbg.png) 0 -120px repeat-x;padding:0 15px;}
.sharet h2{float:left;font-size:14px;color:#808080;}
.sharet span{float:right;}
.sharet .cls{display:inline-block;width:24px;height:23px;background:url(http://w.qhimg.com/images/v2/chrome/themes/skbg.png) no-repeat 0 -196px;vertical-align:middle;}
.share-list{height:347px;padding:5px 0 0 0;}
.share-list dl{clear:both;overflow:hidden;zoom:1;padding:13px 0 0 0;}
.share-list dt{float:left;width:115px;text-align:right;font-size:14px;}
.share-list dd{float:left;*overflow:hidden;*zoom:1;}
.sharef{clear:both;overflow:hidden;zoom:1;}
/*.sharef ul{float:left;width:344px;height:98px;background:#fbfbfb;margin:0 10px;}
*/
.viewer{float:left;width:335px;height:98px;background:#fbfbfb;margin:0 10px;overflow:hidden;position:relative;}
.sharef ul{left:0px;width:336px;position:relative;overflow:hidden;height:98px;}
.sharef li{float:left;width:42px;height:42px;padding:3px;}
.sharef a.selected{opacity:0.4;filter:alpha(opacity=40);;display:block;width:42px;}
.sharef li img{width:40px;height:40px;border:1px solid #cbcbcb;}
.go-l,.go-r{float:left;width:12px;height:24px;background:url(http://w.qhimg.com/images/v2/chrome/themes/skbg.png) no-repeat -25px -196px;margin:40px 0 0 0;}
.go-r{background-position:-38px -196px;}
.share-txt{width:332px;height:101px;background:#f2f2f2;border:1px solid #808080;overflow:auto;font-size:13px;}
.shareb{clear:both;height:65px;background:#ecf7ff;text-align:center;padding:25px 0 0 0;}
.shareb input{vertical-align:middle;}
.share-btn,.share-btn-result{width:126px;height:34px;border:none;cursor:pointer;background:url(http://w.qhimg.com/images/v2/chrome/themes/skbg.png) no-repeat 0 -161px;}
a.share-btn-result{display:block;margin:0 auto;}
.sharec .share-btn{background:url(http://w.qhimg.com/images/v2/chrome/themes/skbg1.png) no-repeat 0 -161px;}
.result{width:429px;height:240px;margin-top:40px;margin-left:52px;}
.result .sharebg{width:429px;height:240px;}
.resultc{width:419px;height:230px;text-align:center;color:#808080;margin-top:40px;margin-left:52px;}
.resultc h3{font-size:30px;font-family:"宋体";font-weight:normal;padding:35px 0 0 0;}
.resultc p{padding:25px 0 35px;}
.resultc p a{font-weight:bold;}
.t_3{background:url(http://w.qhimg.com/images/v2/chrome/img/110629/t_3.png) no-repeat;width:962px;height:57px;margin:0 auto;position:relative;}
.sk-btn{position:absolute;width:139px;height:29px;top:15px;right:18px;}
.main{padding-top:43px;}
/*navi*/
.navi{background:url(http://p3.qhimg.com/d/360browser/20120928/naviBg.gif) repeat-x;height:38px;line-height:38px;margin-bottom:34px;}
.navi td{border:1px solid #e8e8e8;border-top:0;border-bottom:0;text-align:center;}
.navi td a{color:#777;display:block;font-size:14px;font-family:Tahoma;}
.navi td a:hover{text-decoration:none;}
.navi td a.cur,.navi td div.cur{background:#fff;border-top:1px solid #35c4fd;height:37px;line-height:37px;font-weight:700;}
.pos-box a.search-btn,.pos-box a.custom-btn{font-size:12px;display:inline-block;*display:inline;zoom:1;vertical-align:-5px;position:relative;padding-left:34px;}
.pos-box a em{border:4px solid #fbfbfb;border-top-color:#bdbdbd;display:inline-block;*display:inline;zoom:1;vertical-align:-1px;line-height:0;font-size:0;position:absolute;right:0;top:7px;}
.pos-box a.search-btn{background:url(http://p3.qhimg.com/d/360browser/20120928/schIcon-b.png) no-repeat 0 1px;height:18px;line-height:18px;}
.pos-box a.custom-btn{background:url(http://p3.qhimg.com/d/360browser/20120928/styleIcon-b.png) no-repeat 0 1px;height:18px;line-height:18px;}
.pos-box{position:relative;z-index:3;}
.pos-box span{border:1px solid #d6d6d6;border-bottom-color:#fbfbfb;position:absolute;left:-1px;top:0;*top:-10px;height:36px;width:100%;cursor:pointer;opacity:0;filter:Alpha(opacity=0);z-index:4;}
.hover a.search-btn{background:url(http://p3.qhimg.com/d/360browser/20120928/schIcon-b.png) no-repeat 0 -53px !important;}
.hover a.custom-btn{background:url(http://p3.qhimg.com/d/360browser/20120928/styleIcon-b.png) no-repeat 0 -53px !important;}
.hover a em{border-top:none;border-bottom-color:#bdbdbd;vertical-align:4px;}
.hover span{opacity:1;filter:Alpha(opacity=100);}
.hover .search-box{display:block;}
.search-box{position:absolute;right:-1px;top:37px;border:1px solid #d6d6d6;background:#fbfbfb;padding:5px;width:268px;*top:27px;display:none;z-index:3;}
.search-box input{float:left;border:1px solid #d6d6d6;}
.sch-txt{width:201px;padding:5px 4px;box-shadow:inset 0 0 2px #d6d6d6;outline:none;border-radius:3px 0 0 3px;color:#666;}
.sch-btn{background:url(http://p3.qhimg.com/d/360browser/20120928/btnbg03.gif) repeat-x;height:28px;text-align:center;border-left:0 !important;width:57px;border-radius:0 3px 3px 0;color:#5c5c5c;cursor:pointer;}
.more{width:157px;line-height:18px;padding:12px;}
.more p{text-align:left;color:#999;}
.more a.more-btn{color:#fff;font-size:12px;float:right;}
.more-btn{display:inline-block;*display:inline;zoom:1;background:url(http://p3.qhimg.com/d/360browser/20120928/btn02.gif) no-repeat;width:65px;font-family:tahoma;height:20px;color:#fff;font-size:12px;text-align:center;box-shadow:0 2px 0 #ececec;border-radius:2px;}
/*sort-list*/
 .search-tips,.sort-list{color:#b2b2b2;margin-bottom:25px;padding-left:9px;}
.sort-list a{padding:0 15px;color:#777;}
.sort-list a:first-child{margin-left:-15px;}
.sort-list a.cur{font-weight:700;}
.sort-list a:hover{text-decoration:none;}
.search-tips span{font-weight:700;color:#777;padding:0px;}
/*extend-list*/
.extend-list{padding-bottom:88px;overflow:auto;height:600px;}
.extend-list ul:after{content:" ";display:block;height:0;clear:both;visibility:hidden;}
.extend-list ul{zoom:1;position:relative;z-index:1;}
/*webkit scrollbar*/
.extend-list::-webkit-scrollbar-track-piece,.ext-info::-webkit-scrollbar-track-piece{background:#fff;border-radius:0;}
.extend-list::-webkit-scrollbar,.ext-info::-webkit-scrollbar{width:9px;height:9px;}
.extend-list::-webkit-scrollbar-thumb:vertical,.ext-info::-webkit-scrollbar-thumb:vertical{height:9px;background:#d9d9d9;border-radius:12px;}
.extend-list::-webkit-scrollbar-thumb:hover,.ext-info::-webkit-scrollbar-thumb:hover{height:9px;background:#ccc;border-radius:12px;}
.extend-list::-webkit-scrollbar-thumb:horizontal,.ext-info::-webkit-scrollbar-thumb:horizontal{width:9px;background:#dddddd;border-radius:12px;}
.extend-list li{height:177px;width:150px;border:1px solid #ededed;padding:0 8px 8px;float:left;overflow:hidden;background:#fff;letter-spacing:normal;word-spacing:normal;margin:0 26px 26px 0;*margin-right:24px;margin-right:24px\9;display:inline;position:relative;z-index:1;cursor:pointer;}
.extend-list li:hover{box-shadow:0 0 3px #f4f4f4;}
.ext-logo{padding-top:8px;display:block;/*transition:margin-top .25s cubic-bezier(0.250,0.460,0.450,0.940) .1s;-webkit-transition:margin-top .25s cubic-bezier(0.250,0.460,0.450,0.940);-moz-transition:margin-top .2s cubic-bezier(0.250,0.460,0.450,0.940);*/
 margin:0 auto;position:relative;}
.ext-logo img{vertical-align:top;}
.ext-logo span{background:url(http://p3.qhimg.com/d/360browser/20120928/extIcon.png) no-repeat 0 30px;position:absolute;left:-8px;top:0;width:30px;height:30px;}
.ext-logo span.installed{background-position:0 0;}
.ext-logo span.update{background-position:0 -30px;}
.extend-list li h1{height:29px;line-height:29px;font-size:14px;font-weight:700;border-bottom:1px solid #f4f4f4;margin:4px 0 10px;*margin-bottom:11px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.extend-list li p{color:gray;font-family:tahoma;}
.first-info{height:38px;overflow:hidden;margin-bottom:6px;line-height:18px;}
.two-info{line-height:20px;}
.ext-btn{display:block;background:url(http://p3.qhimg.com/d/360browser/20120928/btn1.png) no-repeat;margin:5px auto 0;height:25px;line-height:25px;text-indent:-1000em;width:123px;box-shadow:0 2px 0 #ececec;border-radius:1px;}
.add-btn:hover{background-position:0 -27px;}
.update-btn{background-position:0 -81px}
.update-btn:hover{background-position:0 -108px}
.installed-btn{background-position:0 -161px;}
.dialog_detail .download-btn{right:50px;}
.dialog_detail .add-btn{background-position:0 0;}
.dialog_detail .add-btn:hover{background-position:0 -39px;}
.dialog_detail .update-btn{background-position:0 -117px}
.dialog_detail .update-btn:hover{background-position:0 -156px}
.dialog_detail .installed-btn{background-position:0 -234px;}
/**/
.tab-cont{padding:20px 0;margin:0 33px;}
/*slide-box*/
.slide-box{width:560px;position:relative;height:350px;overflow:hidden;}
.slide-cont{position:relative;height:350px;width:560px;overflow:hidden;}
.slide-cont p{position:absolute;left:0;top:0;height:350px;width:560px;overflow:hidden;}
.slide-cont p img{height:350px;width:560px;}
.pagination{background:rgba(0,0,0,0.4);height:30px;text-align:center;position:absolute;left:0;bottom:0;width:100%;z-index:5;}
.pagination li{display:inline-block;*display:inline;zoom:1;margin:0 3px;}
.pagination li a{display:block;width:9px;height:9px;line-height:0;text-indent:-1000em;overflow:hidden;background:#fff;border-radius:9px;}
.pagination li.current a{background:#34c61c;}
/**/
.ext-info{width:204px;font-family:tahoma;overflow:auto;height:350px;}
.ext-info h2{font-size:14px;color:#4c4c4c;margin-bottom:20px;}
.ext-info h2 span{display:block;font-size:12px;color:#999;font-weight:normal;margin-top:4px;}
.ext-info p{line-height:28px;color:#808080;padding-right:10px;}
.dialog-bg{position:absolute;z-index:1000;left:0;top:0;width:100%;height:100%;background:rgba(225,225,225,0.55);}
/* jqModal base Styling courtesy of;Brice Burgess <bhb@iceburg.net> */
/* The Window's CSS z-index value is respected (takes priority). If none is supplied,the Window's z-index value will be set to 3000 by default (via jqModal.js). */
.jqmWindow{display:none;position:fixed;top:17%;left:50%;margin-left:-300px;width:530px;/* background-color:#EEE;color:#333;border:1px solid black;padding:12px;*/
}
.jqmOverlay{background-color:#000;}
/* Background iframe styling for IE6. Prevents ActiveX bleed-through (<select> form elements,etc.) */
* iframe.jqm{position:absolute;top:0;left:0;z-index:-1;width:expression(this.parentNode.offsetWidth+'px');height:expression(this.parentNode.offsetHeight+'px');}
/* Fixed posistioning emulation for IE6 Star selector used to hide definition from browsers other than IE6 For valid CSS,use a conditional include instead */
* html .jqmWindow{position:absolute;top:expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');}
附件:下载该文件资源,减少时间成本(增值服务)
File Source
.rar
40.35 KB
立即下载(CNY 2.9￥)
打赏 收藏
分享
分享到QQ 分享到微博 微信扫一扫
留言
该资源可下载
File Source
.rar
40.35 KB
立即下载
母慧莲
了解
打赏作者 鼓励作者
Html Js 菜单导航特效1
最新结算
股权转让协议意向书模板
类型: .docx 金额: CNY 2.23￥ 状态: 待结算 详细>
股权转让协议意向书模板
类型: .docx 金额: CNY 0.28￥ 状态: 待结算 详细>
CSS3图片向上3D翻转渐隐消失特效
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
CSS3图片向上3D翻转渐隐消失特效
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
.net c# 将金额转人名币大写金额
类型: .rar 金额: CNY 2.39￥ 状态: 待结算 详细>
.net c# 将金额转人名币大写金额
类型: .rar 金额: CNY 0.3￥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 2.23￥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 0.28￥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 2.23￥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 0.28￥ 状态: 待结算 详细>
我们力求给您提供有用的文章,再此基础上,会附加营收资源,不做任何广告,让平台可以更好发展 若您发现您的权利被侵害，或使用了您的版权，请发邮件联系 sunlifel@foxmail.com ggbig觉得 : 不提供源码的文章不是好文章
合作伙伴
帮助中心
联系我们
  • QQ：21499807
  • 邮箱：sunlifel@foxmail.com
  • QQ扫一扫加QQ
    QQ扫一扫
Copyright 2023-2024 ggbig.com·皖ICP备2023004211号-1
打赏文章