├── README.md ├── images ├── ad.jpg ├── ad2.jpg ├── ad3.jpg ├── ad4.jpg ├── app.jpg ├── arrow.jpg ├── css.jpg ├── imooc.png ├── li_bg.gif ├── line.png ├── list.jpg ├── logo.jpg ├── more.jpg ├── news.jpg ├── news1.jpg ├── news2.jpg ├── tel.jpg ├── li_bg2.gif ├── loading.gif ├── nav_bg.jpg ├── qrcode.jpg ├── search.jpg ├── service.jpg ├── top_bg.jpg ├── type_bg.png ├── weixin.png ├── content_bg.gif ├── nav_left.jpg ├── nav_right.jpg ├── titile_bg.gif ├── product_type_bg.jpg └── QQНиЭМ20140531173247.jpg ├── js ├── mf-pattern │ ├── mF_ladyQ.js │ ├── mF_slide3D.js │ ├── img │ │ ├── loading.gif │ │ ├── mF_qiyi │ │ │ ├── bg.jpg │ │ │ └── loading.gif │ │ ├── mF_games_tb │ │ │ └── ar.gif │ │ ├── mF_kdui │ │ │ ├── dots.png │ │ │ └── slider-arrows.png │ │ ├── mF_kiki │ │ │ ├── Thumbs.db │ │ │ ├── tit-ar.gif │ │ │ ├── ar-left.gif │ │ │ └── ar-right.gif │ │ ├── mF_51xflash │ │ │ ├── play.gif │ │ │ ├── Thumbs.db │ │ │ └── tit-ar.gif │ │ ├── mF_pithy_tb │ │ │ ├── btn.gif │ │ │ └── turn.gif │ │ ├── mF_classicHC │ │ │ ├── btn-bg.png │ │ │ └── btn-red.gif │ │ ├── mF_tbhuabao │ │ │ └── btn-bg.gif │ │ ├── mF_classicHB │ │ │ ├── btn-blue.gif │ │ │ └── btn-gray.gif │ │ ├── mF_sohusports │ │ │ └── sh-btn.gif │ │ └── mF_taobaomall │ │ │ └── btn-bg2.gif │ ├── mF_sohusports.js │ ├── mF_dleung.js │ ├── mF_quwan.js │ ├── mF_luluJQ.css │ ├── mF_pconline.js │ ├── mF_dleung.css │ ├── mF_taobaomall.css │ ├── mF_qiyi.js │ ├── mF_expo2010.js │ ├── mF_pconline.css │ ├── mF_classicHB.js │ ├── mF_51xflash.css │ ├── mF_YSlider.js │ ├── mF_classicHC.js │ ├── mF_quwan.css │ ├── mF_expo2010.css │ ├── mF_liquid.js │ ├── mF_peijianmall.css │ ├── mF_sohusports.css │ ├── mF_liuzg.css │ ├── mF_peijianmall.js │ ├── mF_qiyi.css │ ├── mF_liquid.css │ ├── mF_taobao2010.css │ ├── mF_YSlider.css │ ├── mF_rapoo.css │ ├── mF_taobao2010.js │ ├── mF_kiki.css │ ├── mF_classicHC.css │ ├── mF_classicHB.css │ ├── mF_ladyQ.css │ ├── mF_shutters.css │ ├── mF_kdui.css │ ├── mF_taobaomall.js │ ├── mF_tbhuabao.css │ ├── mF_shutters.js │ ├── mF_kdui.js │ ├── mF_luluJQ.js │ ├── mF_tbhuabao.js │ ├── mF_liuzg.js │ ├── mF_games_tb.css │ ├── mF_slide3D.css │ ├── mF_games_tb.js │ ├── mF_pithy_tb.css │ ├── mF_rapoo.js │ ├── mF_fscreen_tb.js │ ├── mF_51xflash.js │ ├── mF_fscreen_tb.css │ ├── mF_kiki.js │ ├── mF_fancy.css │ ├── mF_pithy_tb.js │ └── mF_fancy.js ├── myfocus-2.0.4.min.js └── myfocus-2.0.4.full.js ├── list.html ├── news.html ├── index.html └── css └── main.css /README.md: -------------------------------------------------------------------------------- 1 | # enterprise-website 2 | 企业网站首页前端设计 3 | -------------------------------------------------------------------------------- /images/ad.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/ad.jpg -------------------------------------------------------------------------------- /images/ad2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/ad2.jpg -------------------------------------------------------------------------------- /images/ad3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/ad3.jpg -------------------------------------------------------------------------------- /images/ad4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/ad4.jpg -------------------------------------------------------------------------------- /images/app.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/app.jpg -------------------------------------------------------------------------------- /images/arrow.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/arrow.jpg -------------------------------------------------------------------------------- /images/css.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/css.jpg -------------------------------------------------------------------------------- /images/imooc.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/imooc.png -------------------------------------------------------------------------------- /images/li_bg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/li_bg.gif -------------------------------------------------------------------------------- /images/line.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/line.png -------------------------------------------------------------------------------- /images/list.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/list.jpg -------------------------------------------------------------------------------- /images/logo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/logo.jpg -------------------------------------------------------------------------------- /images/more.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/more.jpg -------------------------------------------------------------------------------- /images/news.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/news.jpg -------------------------------------------------------------------------------- /images/news1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/news1.jpg -------------------------------------------------------------------------------- /images/news2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/news2.jpg -------------------------------------------------------------------------------- /images/tel.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/tel.jpg -------------------------------------------------------------------------------- /images/li_bg2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/li_bg2.gif -------------------------------------------------------------------------------- /images/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/loading.gif -------------------------------------------------------------------------------- /images/nav_bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/nav_bg.jpg -------------------------------------------------------------------------------- /images/qrcode.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/qrcode.jpg -------------------------------------------------------------------------------- /images/search.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/search.jpg -------------------------------------------------------------------------------- /images/service.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/service.jpg -------------------------------------------------------------------------------- /images/top_bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/top_bg.jpg -------------------------------------------------------------------------------- /images/type_bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/type_bg.png -------------------------------------------------------------------------------- /images/weixin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/weixin.png -------------------------------------------------------------------------------- /images/content_bg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/content_bg.gif -------------------------------------------------------------------------------- /images/nav_left.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/nav_left.jpg -------------------------------------------------------------------------------- /images/nav_right.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/nav_right.jpg -------------------------------------------------------------------------------- /images/titile_bg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/titile_bg.gif -------------------------------------------------------------------------------- /images/product_type_bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/product_type_bg.jpg -------------------------------------------------------------------------------- /js/mf-pattern/mF_ladyQ.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/mF_ladyQ.js -------------------------------------------------------------------------------- /js/mf-pattern/mF_slide3D.js: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/mF_slide3D.js -------------------------------------------------------------------------------- /images/QQНиЭМ20140531173247.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/images/QQНиЭМ20140531173247.jpg -------------------------------------------------------------------------------- /js/mf-pattern/img/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/loading.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_qiyi/bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_qiyi/bg.jpg -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_games_tb/ar.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_games_tb/ar.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_kdui/dots.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_kdui/dots.png -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_kiki/Thumbs.db: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_kiki/Thumbs.db -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_kiki/tit-ar.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_kiki/tit-ar.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_51xflash/play.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_51xflash/play.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_kiki/ar-left.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_kiki/ar-left.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_kiki/ar-right.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_kiki/ar-right.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_pithy_tb/btn.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_pithy_tb/btn.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_pithy_tb/turn.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_pithy_tb/turn.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_qiyi/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_qiyi/loading.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_51xflash/Thumbs.db: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_51xflash/Thumbs.db -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_51xflash/tit-ar.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_51xflash/tit-ar.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_classicHC/btn-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_classicHC/btn-bg.png -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_tbhuabao/btn-bg.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_tbhuabao/btn-bg.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_classicHB/btn-blue.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_classicHB/btn-blue.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_classicHB/btn-gray.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_classicHB/btn-gray.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_classicHC/btn-red.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_classicHC/btn-red.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_kdui/slider-arrows.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_kdui/slider-arrows.png -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_sohusports/sh-btn.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_sohusports/sh-btn.gif -------------------------------------------------------------------------------- /js/mf-pattern/img/mF_taobaomall/btn-bg2.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/somepeopleHavingDream/enterprise-website/HEAD/js/mf-pattern/img/mF_taobaomall/btn-bg2.gif -------------------------------------------------------------------------------- /js/mf-pattern/mF_sohusports.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************搜狐体育****************** 2 | 'mF_sohusports':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picList=$focus.find('.pic li'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | var $numList=$focus.addListNum().find('li'); 7 | //PLAY 8 | $focus.play(function(i){ 9 | $picList[i].style.display='none'; 10 | $txtList[i].style.display='none'; 11 | $numList[i].className=''; 12 | },function(i){ 13 | $picList.eq(i).fadeIn(); 14 | $txtList[i].style.display='block'; 15 | $numList[i].className='current'; 16 | }); 17 | //Control 18 | $focus.bindControl($numList); 19 | } 20 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_dleung.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************凡客风格****************** 2 | 'mF_dleung':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picList=$focus.find('.pic li'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | //CSS 7 | var n=$txtList.length,txtW=Math.ceil((settings.width-2*(n-1))/n); 8 | $txtList.each(function(i){this.style.width=txtW+'px'}); 9 | //PLAY 10 | $focus.play(function(i){ 11 | $picList.eq(i).fadeOut(200,'easeIn'); 12 | $txtList[i].className = ''; 13 | },function(i){ 14 | $picList.eq(i).fadeIn(500,'easeIn'); 15 | $txtList[i].className = 'current'; 16 | }); 17 | //Control 18 | $focus.bindControl($txtList); 19 | } 20 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_quwan.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************趣玩风格****************** 2 | 'mF_quwan':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picList=$focus.find('.pic li'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | var $numList=$focus.addListNum().find('li'); 7 | //CSS 8 | var numH=$numList.css('height'); 9 | $txtList.each(function(){ 10 | $(this).css({bottom:numH+1}); 11 | }); 12 | $focus.css({height:settings.height+numH+1}); 13 | //PLAY 14 | $focus.play(function(i){ 15 | $picList[i].style.display='none'; 16 | $txtList[i].style.display='none'; 17 | $numList[i].className=''; 18 | },function(i){ 19 | $picList.eq(i).fadeIn(); 20 | $txtList[i].style.display='block'; 21 | $numList[i].className='current'; 22 | }); 23 | //Control 24 | $focus.bindControl($numList); 25 | } 26 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_luluJQ.css: -------------------------------------------------------------------------------- 1 | /*=========mF_luluJQ========*/ 2 | .mF_luluJQ_wrap{padding:8px;border:1px solid #999;float:left;background:#fff;}/*背景边框*/ 3 | .mF_luluJQ{ position:relative;} 4 | .mF_luluJQ .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 5 | .mF_luluJQ .pic{width:100%;} 6 | .mF_luluJQ .pic li{position:absolute; background:#000;} 7 | .mF_luluJQ .pic li a{display:block;width:100%;height:100%;position:relative;text-decoration:none;overflow:hidden;} 8 | .mF_luluJQ .pic li a span{display:block;position:relative;width:100%;height:34px;line-height:34px;overflow:hidden;} 9 | .mF_luluJQ .pic li a span b{display:block;position:relative;color:#fff;padding-left:16px;font-size:14px;z-index:1;cursor:pointer;} 10 | .mF_luluJQ .pic li a span i{position:absolute;left:0;top:0;width:100%;height:100%;filter:alpha(opacity=50);opacity: 0.5;background:#000;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_pconline.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************太平洋电脑网风格****************** 2 | 'mF_pconline':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picList=$focus.find('.pic li'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | var $numList=$focus.addListNum().find('li'); 7 | //CSS 8 | var txtH=settings.txtHeight; 9 | $focus[0].style.height=settings.height+txtH+'px'; 10 | //PLAY 11 | $focus.play(function(i){ 12 | $picList[i].style.display='none'; 13 | $txtList[i].style.display='none'; 14 | $numList[i].className=''; 15 | },function(i){ 16 | $picList.eq(i).fadeIn(settings.duration); 17 | $txtList[i].style.display='block'; 18 | $numList[i].className='current'; 19 | }); 20 | //Control 21 | $focus.bindControl($numList); 22 | } 23 | }); 24 | myFocus.config.extend({ 25 | 'mF_pconline':{ 26 | duration:200,//图片淡出时间 27 | txtHeight:28//标题高度 28 | } 29 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_dleung.css: -------------------------------------------------------------------------------- 1 | /*=========mF_dleung========*/ 2 | .mF_dleung{ position:relative;} 3 | .mF_dleung .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_dleung .pic{ position:absolute;} 5 | .mF_dleung .pic ul li{ position:absolute; display:none; top:0; left:0;overflow:hidden;} 6 | .mF_dleung .txt{ position:absolute; bottom:0;overflow:hidden;width:120%;}/*默认标题高度*/ 7 | .mF_dleung .txt li{float:left; width:x; height:28px;line-height:28px;margin-right:2px;overflow:hidden; position:relative;}/*默认标题高度*/ 8 | .mF_dleung .txt li a,.mF_dleung .txt li b{position:absolute;z-index:2;top:0;width:100%;height:100%;color:#fff;font-size:12px;text-decoration:none; text-align:center;}/*标题样式*/ 9 | .mF_dleung .txt li b{z-index:1;opacity:0.7;filter:Alpha(opacity=70); background:#666;} 10 | .mF_dleung .txt li.current a{color:#333;} 11 | .mF_dleung .txt li.current b{background:#fff;} 12 | .mF_dleung .txt li p{ display:none;} 13 | -------------------------------------------------------------------------------- /js/mf-pattern/mF_taobaomall.css: -------------------------------------------------------------------------------- 1 | /*=========mF_taobaomall========*/ 2 | .mF_taobaomall{border:1px solid #ccc; position:relative;} 3 | .mF_taobaomall .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_taobaomall .pic{position:relative;overflow:hidden;border-bottom:0;} 5 | .mF_taobaomall .pic ul{position:absolute;} 6 | .mF_taobaomall .pic ul li{position:relative;overflow:hidden;} 7 | .mF_taobaomall .pic ul.left li{float:left;} 8 | .mF_taobaomall .txt{line-height:28px;border-top:1px solid #ccc;overflow:hidden;width:120%;}/*默认标题高度*/ 9 | .mF_taobaomall .txt li{float:left;border-right:1px solid #dedede;overflow:hidden;}/*默认标题高度*/ 10 | .mF_taobaomall .txt li a{display:block;color:#333;padding:0 10px; text-align:center;font-size:12px;text-decoration:none;background:url(img/mF_taobaomall/btn-bg2.gif) left -44px repeat-x;}/*标题样式*/ 11 | .mF_taobaomall .txt li.current a{color:#fff;font-weight:bold;background-position:left top;} 12 | -------------------------------------------------------------------------------- /js/mf-pattern/mF_qiyi.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************奇艺****************** 2 | 'mF_qiyi':function(settings,$){ 3 | var $focus=$(settings); 4 | var $slider=$focus.addHtml('
'); 5 | $slider[0].appendChild($focus.find('.pic')[0]); 6 | $slider[0].appendChild($focus.addListTxt()[0]); 7 | var $picList=$focus.find('.pic li'); 8 | var $txtList=$focus.find('.txt li'); 9 | var $numList=$focus.addListNum().find('li'); 10 | //CSS 11 | var w=settings.width,txtH=settings.txtHeight,n=$picList.length; 12 | $slider[0].style.width=w*n+'px'; 13 | for(var i=0;i'); 8 | //CSS 9 | var txtH=settings.txtHeight; 10 | $picList.each(function(i){ 11 | this.style.display='none'; 12 | $txtList[i].style.bottom=-txtH+'px'; 13 | }); 14 | //PLAY 15 | $focus.play(function(prev){ 16 | $picList.eq(prev).fadeOut(); 17 | $numList[prev].className=''; 18 | },function(next,n,prev){ 19 | $picList.eq(next).fadeIn(); 20 | $txtList.eq(prev).slide({bottom:-txtH},200,'swing',function(){ 21 | $txtList.eq(next).slide({bottom:0},200); 22 | }); 23 | $numList[next].className='current'; 24 | }); 25 | //Control 26 | settings.delay=200;//固定其延迟 27 | $focus.bindControl($numList); 28 | } 29 | }); 30 | myFocus.config.extend({'mF_expo2010':{txtHeight:36}});//默认文字层高度 -------------------------------------------------------------------------------- /js/mf-pattern/mF_pconline.css: -------------------------------------------------------------------------------- 1 | /*=========mF_pconline========*/ 2 | .mF_pconline{ position:relative;} 3 | .mF_pconline .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_pconline .pic li{width:100%;height:100%;overflow:hidden;position:absolute;display:none;} 5 | .mF_pconline .txt li{position:absolute;z-index:2;bottom:0;height:28px;line-height:28px;background:#DBDBDB;display:none;} 6 | .mF_pconline .txt li a{display:block;position:relative;z-index:1;color:#333;padding-left:10px;font-size:12px;font-weight:bold;text-decoration:none;}/*标题样式*/ 7 | .mF_pconline .num{position:absolute;z-index:3;bottom:5px;right:5px;}/*按钮样式*/ 8 | .mF_pconline .num li{float:left;} 9 | .mF_pconline .num li a{color:#333;float:left;margin-left:3px;width:15px;height:15px;line-height:15px;*line-height:14px;overflow:hidden;border:1px solid #AEC1CC;text-align:center;cursor:pointer;background:#fff;text-decoration:none;} 10 | .mF_pconline .num li.current a,.mF_pconline .num li.hover a{color:#fff;background:#f60;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;}/*当前/悬停按钮样式*/ -------------------------------------------------------------------------------- /js/mf-pattern/mF_classicHB.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({ 2 | 'mF_classicHB':function(settings,$){//*********************经典怀旧系列二--海报风格****************** 3 | var $focus=$(settings); 4 | var $picList=$focus.find('.pic li'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | var $numList=$focus.addListNum().find('li'); 7 | //CSS 8 | var w=settings.width,h=settings.height,txtH=settings.txtHeight;//设置默认的文字高度 9 | for(var i=0,n=$picList.length;i'+$focus.find('.pic').html()+'').find('li'); 6 | var $txtList=$focus.addListTxt().find('li'); 7 | var $numList=$focus.addListNum().find('li'); 8 | //PLAY 9 | var s=settings.direction==='single'?true:false,d1=settings.width,d2=settings.height; 10 | $focus.play(function(i,n){ 11 | var r=s?1:Math.round(1+(Math.random()*(2-1))),dis,d,p={}; 12 | dis=r===1?d1:d2,d=Math.round(Math.random()+s)?dis:-dis,p[r===1?'left':'top']=d; 13 | $picList[i].style.display=$txtList[i].style.display='none'; 14 | $numList[i].className=''; 15 | $rePicList.eq(i).css({left:0,top:0,display:'block',opacity:1}).slide(p,500,'swing').fadeOut(500); 16 | },function(i,n){ 17 | $picList[i].style.display=$txtList[i].style.display='block'; 18 | $numList[i].className='current'; 19 | }); 20 | //Control 21 | $focus.bindControl($numList); 22 | } 23 | }); 24 | myFocus.config.extend({'mF_YSlider':{direction:'random'}});//切出方向,可选：'random'(随机) | 'single'(单向/向右) -------------------------------------------------------------------------------- /js/mf-pattern/mF_classicHC.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({ 2 | 'mF_classicHC':function(settings,$){//*********************经典怀旧系列一--慧聪风格****************** 3 | var $focus=$(settings); 4 | var $picList=$focus.find('.pic li'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | var $numBg=$focus.addHtml('
'); 7 | var $numBox=$focus.addListNum(); 8 | var $numList=$numBox.find('li'); 9 | //CSS 10 | var txtH=settings.txtHeight,w=settings.width,h=settings.height; 11 | $focus.css({width:w+2,height:h+txtH+2}); 12 | $numBg[0].style.bottom=$numBox[0].style.bottom=txtH+1+'px'; 13 | for(var i=0,n=$picList.length;i').html($picBox.html()).find('img'); 9 | //CSS 10 | var w=settings.width,h=settings.height; 11 | $picModList.each(function(i){ 12 | $picList[i].style.cssText='width:0px;z-index:1;'; 13 | this.style.cssText='width:'+w*10+'px;height:'+h+'px;left:'+w+'px;'; 14 | }); 15 | //PLAY 16 | $focus.play(function(i){ 17 | $picList.eq(i).stop()[0].style.width=0+'px'; 18 | $picModList.eq(i).stop()[0].style.left=w+'px'; 19 | $txtList[i].style.display='none'; 20 | $numList[i].className = ''; 21 | },function(i){ 22 | $picModList.eq(i).slide({left:0},100,'linear',function(){ 23 | $picList.eq(i).slide({width:w},700); 24 | $(this).slide({left:-9*w},700); 25 | }); 26 | $txtList[i].style.display='block'; 27 | $numList[i].className = 'current'; 28 | }); 29 | //Control 30 | settings.delay=0;//mouseover模式时延迟固定为0以兼容IE6 31 | $focus.bindControl($numList); 32 | } 33 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_peijianmall.css: -------------------------------------------------------------------------------- 1 | /*=========mF_peijianmall========*/ 2 | .mF_peijianmall{ position:relative;} 3 | .mF_peijianmall .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_peijianmall .pic ul{position:absolute;} 5 | .mF_peijianmall .pic ul li{overflow:hidden;} 6 | .mF_peijianmall .pic ul.left li{float:left;} 7 | .mF_peijianmall .pic ul.right li{float:right;} 8 | .mF_peijianmall .txt{position:absolute;z-index:2;left:18px;bottom:10px;} 9 | .mF_peijianmall .txt li{float:left; position:relative;margin-right:10px;height:40px;width:68px;overflow:hidden;cursor:pointer;border:1px solid #f90; border-radius:3px;} 10 | .mF_peijianmall .txt li b{background:#FBF6DC; width:100%; height:100%; opacity:0.8; filter:alpha(opacity=80); position:absolute; top:0;-webkit-transition:color 0.4s;-moz-transition:color 0.4s;-o-transition:color 0.4s; } 11 | .mF_peijianmall .txt li a{ display:block;padding:3px;color:#D3520C; text-decoration:none; position:relative; z-index:1;-webkit-transition:color 0.4s;-moz-transition:color 0.4s;-o-transition:color 0.4s;} 12 | .mF_peijianmall .txt li.current{border:1px solid #c00;} 13 | .mF_peijianmall .txt li.current b{background:#FB7917;} 14 | .mF_peijianmall .txt li.current a{color:#fff;} 15 | .mF_peijianmall .txt li p{ display:none;} 16 | -------------------------------------------------------------------------------- /js/mf-pattern/mF_sohusports.css: -------------------------------------------------------------------------------- 1 | /*=========mF_sohusports========*/ 2 | .mF_sohusports_wrap{padding:8px;border:1px solid #999;float:left;background:#fff;}/*背景边框*/ 3 | .mF_sohusports{ position:relative;} 4 | .mF_sohusports .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 5 | .mF_sohusports .pic li{position:absolute; display:none;} 6 | .mF_sohusports .txt li{position:absolute;z-index:2;bottom:0;height:60px;line-height:32px; display:none;} 7 | .mF_sohusports .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 8 | .mF_sohusports .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=40);opacity:0.4;}/*标题背景*/ 9 | .mF_sohusports .txt li p{display:none;}/*隐藏详细描述*/ 10 | .mF_sohusports .num{position:absolute;z-index:3;bottom:8px;right:6px;}/*按钮样式*/ 11 | .mF_sohusports .num li{float:left;} 12 | .mF_sohusports .num li a{color:#fff;float:left;width:20px;height:20px;line-height:18px;overflow:hidden;text-align:center;margin-right:4px;cursor:pointer;background:url(img/mF_sohusports/sh-btn.gif) left no-repeat;text-decoration:none;} 13 | .mF_sohusports .num li.current a,.mF_sohusports .num li.hover a{color:#FF7B11;background-position:right;}/*当前/悬停按钮样式*/ -------------------------------------------------------------------------------- /js/mf-pattern/mF_liuzg.css: -------------------------------------------------------------------------------- 1 | /*=========mF_liuzg --绚丽切片风格========*/ 2 | .mF_liuzg{ position:relative;} 3 | .mF_liuzg .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_liuzg .pic li{position:relative;overflow:hidden;float:left;} 5 | .mF_liuzg .pic li div{width:100%;position:absolute;} 6 | .mF_liuzg .pic li div a{display:block;overflow:hidden;} 7 | .mF_liuzg .txt li{position:absolute;z-index:2;bottom:0;height:36px;line-height:36px;display:none;} 8 | .mF_liuzg .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 9 | .mF_liuzg .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=40);opacity:0.4;}/*标题背景*/ 10 | .mF_liuzg .num{position:absolute;z-index:3;bottom:6px;right:8px;color:#333;} 11 | .mF_liuzg .num li{float:left;width:22px;height:18px;position:relative;border:1px solid #333;line-height:18px;text-align:center;margin-right:3px;cursor:pointer;background:#eee;filter:alpha(opacity=70);opacity:0.7;}/*按钮样式*/ 12 | .mF_liuzg .num li a{color:#333;text-decoration:none;} 13 | .mF_liuzg .num li.current{background:#f60;font-weight:bold;height:20px;line-height:20px;top:-2px;filter:alpha(opacity=100);opacity:1;} 14 | .mF_liuzg .num li.current a{color:#fff;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_peijianmall.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************配件商城风格****************** 2 | 'mF_peijianmall':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picUl=$focus.find('.pic ul'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | $picUl[0].innerHTML+=$picUl[0].innerHTML;//无缝复制 7 | //CSS 8 | var n=$txtList.length,dir=settings.direction,prop=dir==='left'?'width':'height',dis=settings[prop]; 9 | $picUl.addClass(dir)[0].style[prop]=dis*n*2+'px'; 10 | $picUl.find('li').each(function(){//消除上下li间的多余间隙 11 | $(this).css({width:settings.width,height:settings.height}); 12 | }); 13 | //PLAY 14 | var param={}; 15 | $focus.play(function(i){ 16 | $txtList[i>=n?(i-n):i].className = ''; 17 | },function(i){ 18 | param[dir]=-dis*i; 19 | $picUl.slide(param,settings.duration,settings.easing); 20 | $txtList[i>=n?(i-n):i].className = 'current'; 21 | },settings.seamless); 22 | //Control 23 | $focus.bindControl($txtList); 24 | } 25 | }); 26 | myFocus.config.extend({ 27 | 'mF_peijianmall':{//可选个性参数 28 | txtHeight:40,//标题高度 29 | seamless:true,//是否无缝，可选：true(是) | false(否) 30 | duration:800,//过渡时间(毫秒)，时间越大速度越小 31 | direction:'left',//运动方向，可选：'top'(向上) | 'left'(向左) 32 | easing:'easeOut'//运动形式，可选：'easeOut'(快出慢入) | 'easeIn'(慢出快入) | 'easeInOut'(慢出慢入) | 'swing'(摇摆运动) | 'linear'(匀速运动) 33 | } 34 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_qiyi.css: -------------------------------------------------------------------------------- 1 | /*=========mF_qiyi --奇艺主题========*/ 2 | .mF_qiyi_wrap{position:relative;float:left;overflow:hidden;padding:6px;border:1px solid #333;}/*背景边框*/ 3 | .mF_qiyi .loading{color:#f60;background:#333 url(img/mF_qiyi/bg.jpg) center no-repeat; z-index:9;}/*载入背景*/ 4 | .mF_qiyi .slider{height:100%;position:absolute;overflow:hidden;} 5 | .mF_qiyi .slider .pic{height:100%;width:100%;} 6 | .mF_qiyi .slider .pic li{height:100%;overflow:hidden;float:left;} 7 | .mF_qiyi .slider .txt{width:100%;} 8 | .mF_qiyi .slider .txt li{position:relative;float:left;height:34px;line-height:34px;}/*默认标题高度*/ 9 | .mF_qiyi .slider .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*文字样式*/ 10 | .mF_qiyi .slider .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=40);opacity:0.4;} 11 | .mF_qiyi .num{position:absolute;z-index:2;bottom:6px;right:12px;} 12 | .mF_qiyi .num li{float:left;width:18px;height:16px;line-height:16px;margin-left:4px;overflow:hidden;text-align:center;border:1px solid #000;cursor:pointer;} 13 | .mF_qiyi .num li a{color:#000;display:block;background:#ccc;text-decoration:none;} 14 | .mF_qiyi .num li.current a,.mF_qiyi .num li.hover a{background:#f60;color:#fff;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;}/*当前/悬停按钮样式*/ -------------------------------------------------------------------------------- /js/mf-pattern/mF_liquid.css: -------------------------------------------------------------------------------- 1 | /*=========mF_liquid ========*/ 2 | .mF_liquid{ position:relative;} 3 | .mF_liquid .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_liquid .pic{position:static;} 5 | .mF_liquid .pic li,.mF_liquid .pic_mod li{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;} 6 | .mF_liquid .pic li img,.mF_liquid .pic_mod li img{position:absolute;left:0;top:0;} 7 | .mF_liquid .txt li{position:absolute;z-index:2;bottom:0;width:100%;height:38px;line-height:38px;display:none;}/*默认标题高度*/ 8 | .mF_liquid .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 9 | .mF_liquid .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=30);opacity:0.3;} 10 | .mF_liquid .num{position:absolute;z-index:3;bottom:6px;right:6px;}/*按钮样式*/ 11 | .mF_liquid .num li{float:left;} 12 | .mF_liquid .num li a{color:#333;float:left;width:20px;height:18px;position:relative;line-height:18px;border:1px solid #196BA9;text-align:center;margin-right:3px;cursor:pointer;background:#dedede;filter:alpha(opacity=80);opacity:0.8;text-decoration:none;} 13 | .mF_liquid .num li.current a,.mF_liquid .num li.hover a{background:#09f;color:#fff;font-weight:bold;height:20px;line-height:20px;top:-2px;filter:alpha(opacity=100);opacity:1;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_taobao2010.css: -------------------------------------------------------------------------------- 1 | /*=========mF_taobao2010========*/ 2 | .mF_taobao2010{ position:relative;} 3 | .mF_taobao2010 .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_taobao2010 .pic ul{position:absolute;} 5 | .mF_taobao2010 .pic ul li{position:relative;overflow:hidden;} 6 | .mF_taobao2010 .pic ul.left li{float:left;} 7 | .mF_taobao2010 .txt li{position:absolute;z-index:2;bottom:0;width:100%;height:38px;line-height:38px;display:none;}/*默认标题高度*/ 8 | .mF_taobao2010 .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 9 | .mF_taobao2010 .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=30);opacity:0.3;} 10 | .mF_taobao2010 .num{position:absolute;z-index:3;bottom:6px;right:6px;}/*按钮样式*/ 11 | .mF_taobao2010 .num li{float:left;} 12 | .mF_taobao2010 .num li a{float:left;color:#E54B3B;width:20px;height:18px;position:relative;line-height:18px;border:1px solid #F27602;text-align:center;margin-right:3px;cursor:pointer;background:#FDF1D4;text-decoration:none;-webkit-transition:color 0.4s;-moz-transition:color 0.4s;-o-transition:color 0.4s;} 13 | .mF_taobao2010 .num li.current a,.mF_taobao2010 .num li.hover a{background:#FE8B18;color:#fff;border-color:#D86C01;font-weight:bold;height:20px;line-height:20px;top:-2px;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_YSlider.css: -------------------------------------------------------------------------------- 1 | /*=========mF_YSlider ========*/ 2 | .mF_YSlider{ position:relative;} 3 | .mF_YSlider .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_YSlider .pic li,.mF_YSlider .rePic li{position:absolute;top:0;left:0;display:none;} 5 | .mF_YSlider .txt li{position:absolute;z-index:2;bottom:0;width:100%;height:36px;line-height:36px;display:none;}/*默认标题高度*/ 6 | .mF_YSlider .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 7 | .mF_YSlider .txt li b{display:block;width:100%;height:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=40);opacity:0.4;} 8 | .mF_YSlider .num{position:absolute;z-index:3;bottom:8px;right:2px;} 9 | .mF_YSlider .num li{position:relative;float:left;width:20px;height:20px;overflow:hidden;text-align:center;margin-right:4px;cursor:pointer;} 10 | .mF_YSlider .num li a,.mF_YSlider .num li b{display:block;width:18px;height:18px;border:1px solid #dedede;line-height:18px;position:absolute;z-index:2;top:0;left:0;color:#333; text-decoration:none;}/*按钮样式*/ 11 | .mF_YSlider .num li b{z-index:1;background:#fff;filter:alpha(opacity=60);opacity:0.6;} 12 | .mF_YSlider .num li.current a,.mF_YSlider .num li.hover a{border-color:#E63003;color:#fff;background:#F66E08;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;}/*当前/悬停按钮 -------------------------------------------------------------------------------- /js/mf-pattern/mF_rapoo.css: -------------------------------------------------------------------------------- 1 | /*=========mF_rapoo========*/ 2 | .mF_rapoo_wrap{padding:4px;border:1px solid #999;float:left;background:#fff;}/*背景边框*/ 3 | .mF_rapoo{ position:relative;} 4 | .mF_rapoo .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 5 | .mF_rapoo .pic li{width:100%;height:100%;overflow:hidden;position:absolute;} 6 | .mF_rapoo .txt{position:absolute;z-index:2;bottom:12px;width:140px;height:18px;right:26px;} 7 | .mF_rapoo .txt li{position:absolute;height:18px;line-height:18px;*line-height:20px;width:0px;background:#f6f6f6; border-radius:3px;} 8 | .mF_rapoo .txt li a{display:block;position:relative;z-index:1;color:#f60;padding:0 10px;font-size:12px;text-decoration:none;}/*标题*/ 9 | .mF_rapoo .num{position:absolute;z-index:3;bottom:12px;right:26px;}/*按钮样式*/ 10 | .mF_rapoo .num li{float:left;display:inline;margin-left:6px;width:18px;height:18px;line-height:18px;overflow:hidden;text-align:center;cursor:pointer;border-radius:3px;} 11 | .mF_rapoo .num li a{display:block;color:#f60;background:#eee;text-decoration:none;} 12 | .mF_rapoo .num li.current a,.mF_rapoo .num li.hover a{color:#fff;background:#f60;}/*当前/悬停按钮样式*/ 13 | .mF_rapoo .prev,.mF_rapoo .next{width:8px;height:22px;overflow:hidden;position:absolute;z-index:4;bottom:15px;right:88px;cursor:pointer;} 14 | .mF_rapoo .prev a,.mF_rapoo .next a{display:block;font:bold 26px/28px arial;color:#E3E3E3;text-align:center;} 15 | .mF_rapoo .prev a:hover,.mF_rapoo .next a:hover{color:#f60;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_taobao2010.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************淘宝2010主页风格****************** 2 | 'mF_taobao2010':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picUl=$focus.find('.pic ul'); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | var $numList=$focus.addListNum().find('li'); 7 | $picUl[0].innerHTML+=$picUl[0].innerHTML;//无缝复制 8 | //CSS 9 | var n=$txtList.length,dir=settings.direction,prop=dir==='left'?'width':'height',dis=settings[prop]; 10 | $picUl.addClass(dir)[0].style[prop]=dis*n*2+'px'; 11 | $picUl.find('li').each(function(){//消除上下li间的多余间隙 12 | $(this).css({width:settings.width,height:settings.height}); 13 | }); 14 | //PLAY 15 | var param={}; 16 | $focus.play(function(i){ 17 | var index=i>=n?(i-n):i; 18 | $numList[index].className = ''; 19 | $txtList[index].style.display = 'none'; 20 | },function(i){ 21 | var index=i>=n?(i-n):i; 22 | param[dir]=-dis*i; 23 | $picUl.slide(param,settings.duration,settings.easing); 24 | $numList[index].className = 'current'; 25 | $txtList[index].style.display = 'block'; 26 | },settings.seamless); 27 | //Control 28 | $focus.bindControl($numList); 29 | } 30 | }); 31 | myFocus.config.extend({ 32 | 'mF_taobao2010':{//可选个性参数 33 | seamless:true,//是否无缝，可选：true(是)/false(否) 34 | duration:600,//过渡时间(毫秒)，时间越大速度越小 35 | direction:'left',//运动方向，可选：'top'(向上) | 'left'(向左) 36 | easing:'easeOut'//运动形式，可选：'easeOut'(快出慢入) | 'easeIn'(慢出快入) | 'easeInOut'(慢出慢入) | 'swing'(摇摆运动) | 'linear'(匀速运动) 37 | } 38 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_kiki.css: -------------------------------------------------------------------------------- 1 | /*=========mF_kiki========*/ 2 | .mF_kiki_wrap{padding:6px;border:1px solid #999;float:left;background:#fff;}/*背景边框*/ 3 | .mF_kiki{ position:relative;} 4 | .mF_kiki .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 5 | .mF_kiki .pic li{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;} 6 | .mF_kiki .txt li{position:absolute;z-index:2;left:0;bottom:0;height:30px;line-height:30px;*line-height:32px;overflow:hidden;background:url(img/mF_kiki/tit-ar.gif) left 10px no-repeat;display:none;} 7 | .mF_kiki .txt li a{display:block;color:#333;padding-left:32px;font-size:12px;text-decoration:none;} 8 | .mF_kiki .num{position:absolute;bottom:34px;right:2px;z-index:9;} 9 | .mF_kiki .num li{float:left;margin-right:2px;width:20px;height:6px;overflow:hidden;border:1px solid #000;background:#ccc;cursor:pointer;} 10 | .mF_kiki .num li.current,.mF_kiki .num li.hover{background:#E92B00;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;} 11 | .mF_kiki .num li a{ display:none;} 12 | .mF_kiki .nav{position:absolute;width:100px;height:30px;line-height:30px;z-index:3;bottom:0;right:0;} 13 | .mF_kiki .nav a,.mF_kiki .nav span{float:left;color:#333; text-decoration:none;} 14 | .mF_kiki .nav a:hover{color:#D91C00;} 15 | .mF_kiki .nav a.prev{cursor:pointer;padding-left:10px;background:url(img/mF_kiki/ar-left.gif) left no-repeat;} 16 | .mF_kiki .nav a.next{cursor:pointer;padding:0 10px 0 4px;background:url(img/mF_kiki/ar-right.gif) right no-repeat;} 17 | .mF_kiki .nav span{margin-left:3px;} 18 | -------------------------------------------------------------------------------- /js/mf-pattern/mF_classicHC.css: -------------------------------------------------------------------------------- 1 | /*=========mF_classicHC --经典怀旧系列一--========*/ 2 | .mF_classicHC{ position:relative;} 3 | .mF_classicHC .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_classicHC .pic{border:1px solid #666;} 5 | .mF_classicHC .pic li{position:absolute;left:0;top:0;} 6 | .mF_classicHC .txt li{position:absolute;left:0;background:#dedede;overflow:hidden;height:26px;line-height:26px;} 7 | .mF_classicHC .txt li a{display:block;color:#333;text-align:center;font-size:12px;font-weight:bold;text-decoration:none;}/*文字样式*/ 8 | .mF_classicHC .num,.mF_classicHC .num_bg{height:19px;position:absolute;z-index:3;right:0;bottom:31px;color:#fff;}/*按钮样式*/ 9 | .mF_classicHC .num_bg{width:100%;background:url(img/mF_classicHC/btn-bg.png) right bottom no-repeat;_height:16px;_background:0;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/mF_classicHC/btn-bg.png', sizingMethod='scale');}/*为兼容IE6请把滤镜内的图片地址改为绝对地址*/ 10 | .mF_classicHC .num_bg li{position:absolute;} 11 | .mF_classicHC .num li{float:left;width:26px;height:16px;line-height:16px;padding-top:3px;text-align:center;cursor:pointer;position:relative;} 12 | .mF_classicHC .num li a{color:#fff;} 13 | .mF_classicHC .num li b{position:absolute;top:3px;left:0;width:1px;height:16px;overflow:hidden;background:#DADADA;} 14 | .mF_classicHC .num li.hover,.mF_classicHC .num li.current{background-image:url(img/mF_classicHC/btn-red.gif);}/*当前/悬停按钮样式*/ 15 | .mF_classicHC .num li.hover{background-position:right bottom;} 16 | .mF_classicHC .num li.current{background-position:left top;} 17 | -------------------------------------------------------------------------------- /js/mf-pattern/mF_classicHB.css: -------------------------------------------------------------------------------- 1 | /*=========mF_classicHB --经典怀旧系列二--========*/ 2 | .mF_classicHB_wrap{padding:8px;border:1px solid #999;float:left;background:#fff;}/*背景边框*/ 3 | .mF_classicHB{-webkit-text-size-adjust:none; position:relative;}/*修正chrome的字体bug*/ 4 | .mF_classicHB .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 5 | .mF_classicHB .pic{position:relative;} 6 | .mF_classicHB .pic li{position:absolute;width:120%;height:120%;} 7 | .mF_classicHB .pic li img{width:100%;height:100%;} 8 | .mF_classicHB .txt li{position:absolute;left:0;top:0;overflow:hidden;height:20px;line-height:20px;} 9 | .mF_classicHB .txt li a{display:block;position:relative;z-index:1;color:#fff;text-align:center;font-size:12px;text-decoration:none;}/*文字样式*/ 10 | .mF_classicHB .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=40);opacity:0.4;} 11 | .mF_classicHB .num{height:17px;position:absolute;z-index:3;right:0;bottom:2px;color:#fff;} 12 | .mF_classicHB .num li{float:left;margin-right:2px;width:16px;height:17px;text-align:center;position:relative;} 13 | .mF_classicHB .num li a{display:block;position:relative;z-index:1;line-height:16px;font-size:10px;color:#fff;text-decoration:none;cursor:pointer;}/*按钮样式*/ 14 | .mF_classicHB .num li b{display:block;width:100%;height:17px;position:absolute;top:0;left:0;background:url(img/mF_classicHB/btn-gray.gif) no-repeat;filter:alpha(opacity=70);opacity:0.7;} 15 | .mF_classicHB .num li.current b,.mF_classicHB .num li.hover b{background-image:url(img/mF_classicHB/btn-blue.gif)}/*当前/悬停按钮样式*/ -------------------------------------------------------------------------------- /js/mf-pattern/mF_ladyQ.css: -------------------------------------------------------------------------------- 1 | /*=========mF_ladyQ========*/ 2 | .mF_ladyQ{ position:relative;} 3 | .mF_ladyQ .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_ladyQ .pic li{width:100%;height:100%;overflow:hidden;position:absolute;display:none;} 5 | .mF_ladyQ .txt li{position:absolute;z-index:2;left:0;bottom:28px;line-height:30px;font-family:'微软雅黑'; visibility:hidden; opacity:0;} 6 | .mF_ladyQ .txt li.current{ visibility:visible; opacity:1;-webkit-transition:all 1s .4s;-moz-transition:all 1s .4s;-o-transition:all 1s .4s;} 7 | .mF_ladyQ .txt li a{display:block;position:relative;z-index:1;color:#fff;margin-top:2px;padding-left:10px;font-size:16px;text-decoration:none;}/*标题样式*/ 8 | .mF_ladyQ .txt li p{position:relative;z-index:1;padding-left:11px;line-height:22px;font-size:14px;color:#eee;} 9 | .mF_ladyQ .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=40);opacity:0.4;} 10 | .mF_ladyQ .time_bar{position:absolute;left:0;height:20px;overflow:hidden;background:#444;} 11 | .mF_ladyQ .num{position:relative;height:28px;background:#000;}/*按钮样式*/ 12 | .mF_ladyQ .num ul{position:absolute;right:6px;top:4px;} 13 | .mF_ladyQ .num ul li{float:left;display:inline;margin-left:3px;width:20px;height:20px;line-height:20px;overflow:hidden;text-align:center;cursor:pointer;} 14 | .mF_ladyQ .num ul li a{color:#B1B1B1;display:block;background:#444;text-decoration:none;} 15 | .mF_ladyQ .num ul li.current a,.mF_ladyQ .num ul li.hover a{color:#fff;background:#f60;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;}/*当前/悬停按钮样式*/ -------------------------------------------------------------------------------- /js/mf-pattern/mF_shutters.css: -------------------------------------------------------------------------------- 1 | /*=========mF_shutters ========*/ 2 | .mF_shutters{ position:relative;} 3 | .mF_shutters .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_shutters .pic{position:absolute;z-index:1;} 5 | .mF_shutters .pic ul{ position:absolute; top:0;left:0;width:x;height:100%; overflow:hidden;} 6 | .mF_shutters .pic ul li{ position:absolute;top:0;left:0; display:none;} 7 | .mF_shutters .txt{position:absolute;z-index:2;bottom:0; width:100%;height:36px;line-height:36px;}/*默认标题高度*/ 8 | .mF_shutters .txt li{position:absolute;top:0;width:100%; visibility:hidden;opacity:0;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;} 9 | .mF_shutters .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 10 | .mF_shutters .txt li b{display:block;width:100%;height:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=40);opacity:0.4;} 11 | .mF_shutters .txt li.current{ visibility:visible; opacity:1;-webkit-transition:all 1s 1s;-moz-transition:all 1s 1s;-o-transition:all 1s 1s;} 12 | .mF_shutters .prev a,.mF_shutters .next a{ position:absolute;bottom:46px;left:0;padding:4px 6px; z-index:9;color:#333; text-decoration:none; background:#fff; border-radius:0 3px 3px 0;visibility:hidden;opacity:0;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;} 13 | .mF_shutters .hover a{visibility:visible;filter:alpha(opacity=80);opacity:0.8;} 14 | .mF_shutters .next a{left:auto;right:0;border-radius:3px 0 0 3px;} 15 | .mF_shutters .prev a:hover,.mF_shutters .next a:hover{ color:#f60;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_kdui.css: -------------------------------------------------------------------------------- 1 | /*=========mF_kdui ========*/ 2 | .mF_kdui{ background:#000; position:relative;} 3 | .mF_kdui .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_kdui .pic{position:absolute;z-index:1;width:100%;height:100%; overflow:hidden;} 5 | .mF_kdui .pic li{ position:absolute; top:0; display:none;} 6 | .mF_kdui .txt{position:absolute;z-index:2; top:12px;left:12px; width:200px;}/*默认标题高度*/ 7 | .mF_kdui .txt li{position:absolute;top:0;width:100%; padding:12px; display:none;} 8 | .mF_kdui .txt li a{position:relative;z-index:1;display:block;color:#fff;font-size:14px;font-weight:bold;text-decoration:none; font-family:'微软雅黑';}/*标题样式*/ 9 | .mF_kdui .txt li b{position:absolute;top:0;left:0;display:block;width:100%;height:100%;background:#000;filter:alpha(opacity=20);opacity:0.2; border-radius:5px;} 10 | .mF_kdui .txt li p{color:#fff;} 11 | .mF_kdui .dot{position:absolute; z-index:3;bottom:8px;left:0;width:100%;text-align:center;} 12 | .mF_kdui .dot li{ display:inline-block;margin:0 3px;*display:inline;*zoom:1; width:16px;height:16px; background:url(img/mF_kdui/dots.png); cursor:pointer;} 13 | .mF_kdui .dot li.current{background-position: 0 -16px;} 14 | .mF_kdui .prev,.mF_kdui .next{ visibility:hidden; opacity:0; position:absolute; z-index:9;bottom:40%; left:12px; cursor:pointer; background:url(img/mF_kdui/slider-arrows.png) 0 0; width:38px; height:38px;-webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;} 15 | .mF_kdui .next{ left:auto;right:12px; background-position:100% 0;} 16 | .mF_kdui .prev:hover,.mF_kdui .next:hover{opacity:1;} 17 | .mF_kdui .arr-hover{ visibility:visible; opacity:0.5;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_taobaomall.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************淘宝商城风格****************** 2 | 'mF_taobaomall':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picBox=$focus.find('.pic'); 5 | var $picUl=$picBox.find('ul'); 6 | var $txtList=$focus.addListTxt().find('li'); 7 | $picUl[0].innerHTML+=$picUl[0].innerHTML;//无缝复制 8 | //CSS 9 | var n=$txtList.length,dir=settings.direction,prop=dir==='left'?'width':'height',dis=settings[prop]; 10 | $picUl.addClass(dir)[0].style[prop]=dis*n*2+'px'; 11 | $picUl.find('li').each(function(){//消除上下li间的多余间隙 12 | $(this).css({width:settings.width,height:settings.height}); 13 | }); 14 | var txtH=settings.txtHeight; 15 | $focus.css({height:settings.height+txtH+1}); 16 | $picBox.css({width:settings.width,height:settings.height}); 17 | $txtList.each(function(){this.style.width=(settings.width-n-1)/n+1+'px'}); 18 | $txtList[n-1].style.border=0; 19 | //PLAY 20 | var param={}; 21 | $focus.play(function(i){ 22 | $txtList[i>=n?(i-n):i].className = ''; 23 | },function(i){ 24 | param[dir]=-dis*i; 25 | $picUl.slide(param,settings.duration,settings.easing); 26 | $txtList[i>=n?(i-n):i].className = 'current'; 27 | },settings.seamless); 28 | //Control 29 | $focus.bindControl($txtList); 30 | } 31 | }); 32 | myFocus.config.extend({ 33 | 'mF_taobaomall':{//可选个性参数 34 | txtHeight:28,//默认标题按钮高度 35 | seamless:true,//是否无缝：true(是)| false(否) 36 | duration:600,//过渡时间(毫秒)，时间越大速度越小 37 | direction:'top',//运动方向，可选：'top'(向上) | 'bottom'(向下) | 'left'(向左) | 'right'(向右) 38 | easing:'easeOut'//运动形式，可选：'easeOut'(快出慢入) | 'easeIn'(慢出快入) | 'easeInOut'(慢出慢入) | 'swing'(摇摆运动) | 'linear'(匀速运动) 39 | } 40 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_tbhuabao.css: -------------------------------------------------------------------------------- 1 | /*=========mF_tbhuabao========*/ 2 | .mF_tbhuabao {background:#ddd;border:10px solid #333;overflow:visible;margin-left:10px; position:relative;} 3 | .mF_tbhuabao .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_tbhuabao .pic,.mF_tbhuabao .pic ul{position:absolute;top:0;left:0;overflow:hidden;} 5 | .mF_tbhuabao .pic li{position:relative;float:left;overflow:hidden;} 6 | .mF_tbhuabao .txt li{position:absolute;z-index:2;width:100%;height:38px;line-height:38px;display:none;}/*默认标题高度*/ 7 | .mF_tbhuabao .txt li a{display:block;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 8 | .mF_tbhuabao .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=30);opacity:0.3;} 9 | .mF_tbhuabao .dot{position:absolute;bottom:0;left:0;height:32px;line-height:28px;width:100%;text-align:center;} 10 | .mF_tbhuabao .dot li{display:inline;margin:0 3px;} 11 | .mF_tbhuabao .dot li a{color:#999;font-size:26px;text-decoration:none;-webkit-transition:color 0.4s;-moz-transition:color 0.4s;-o-transition:color 0.4s;} 12 | .mF_tbhuabao .dot li.current a{color:#f60;} 13 | .mF_tbhuabao .prev,.mF_tbhuabao .next{font:700 53px/58px arial;width:37px;height:65px;overflow:hidden;position:absolute;z-index:4;left:-20px;cursor:pointer;background:url(img/mF_tbhuabao/btn-bg.gif) no-repeat;} 14 | .mF_tbhuabao .next{left:auto;right:-20px;} 15 | .mF_tbhuabao .prev a,.mF_tbhuabao .next a{display:block;color:#bbb;text-align:center;text-decoration:none;} 16 | .mF_tbhuabao .prev a:hover,.mF_tbhuabao .next a:hover{color:#f60;} 17 | -------------------------------------------------------------------------------- /js/mf-pattern/mF_shutters.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************百叶窗****************** 2 | 'mF_shutters':function(settings,$){ 3 | var c=Math.floor(settings.width/50); 4 | var $focus=$(settings); 5 | var $txtList=$focus.addListTxt().find('li'); 6 | var $picUls=$focus.find('.pic ul').repeat(c); 7 | var $prevBtn=$focus.addHtml(''); 8 | var $nextBtn=$focus.addHtml(''); 9 | var $picListArr=[]; 10 | //CSS 11 | var w=settings.width/c; 12 | $picUls.each(function(i){ 13 | $(this).css({width:w*(i+1),zIndex:c-i}); 14 | $picListArr.push($(this).find('li')); 15 | }); 16 | //PLAY 17 | var running=false,done=0;//记录运行状态 18 | $focus.play(function(i){ 19 | running=true; 20 | $txtList[i].className=''; 21 | },function(i){ 22 | $txtList[i].className='current'; 23 | for(var j=0;j'); 8 | var $nextBtn=$focus.addHtml(''); 9 | //PLAY 10 | var param={isRunning:false}; 11 | $focus.play(null,function(i,n,l){ 12 | param.isRunning=true; 13 | $txtList.eq(l).slide({left:-settings.width},800,'easeInBack'); 14 | fx(i,l);//延迟执行部分 15 | }); 16 | function fx(i,l){ 17 | setTimeout(function(){ 18 | $txtList.eq(i).css({display:'block',left:settings.width}).slide({left:0},300); 19 | $picList.eq(i).css({display:'block',left:settings.width}).slide({left:0},function(){param.isRunning=false}); 20 | if(i!==l) $picList.eq(l).slide({left:-settings.width},700); 21 | $dotList[l].className=''; 22 | $dotList[i].className='current'; 23 | },600); 24 | } 25 | //Control 26 | $focus.bindControl($dotList,param); 27 | $prevBtn.bind('click',function(){if(!param.isRunning) $focus.run('-=1')}); 28 | $nextBtn.bind('click',function(){if(!param.isRunning) $focus.run('+=1')}); 29 | $focus.bind('mouseover',function(){$prevBtn.addClass('arr-hover'),$nextBtn.addClass('arr-hover')}); 30 | $focus.bind('mouseout',function(){$prevBtn.removeClass('arr-hover'),$nextBtn.removeClass('arr-hover')}); 31 | } 32 | }); 33 | myFocus.extend( myFocus.fn.easing,{//扩展缓动方法 34 | easeInBack: function (t, b, c, d, s) { 35 | if (s == undefined) s = 1.70158; 36 | return c*(t/=d)*t*((s+1)*t - s) + b; 37 | } 38 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_luluJQ.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************luluJQ****************** 2 | 'mF_luluJQ':function(settings,$){ 3 | var $focus=$(settings); 4 | $focus.find('.pic a').each(function(){ 5 | var $o=$(this),txt=$o.find('img')[0].alt; 6 | $o.addHtml(''+txt+''); 7 | }); 8 | var $picBox=$focus.find('.pic'); 9 | var $picList=$focus.find('li'); 10 | var $imgList=$picBox.find('img'); 11 | var $txtList=$focus.find('span'); 12 | var $txtBgList=$focus.find('i'); 13 | //CSS 14 | var n=$picList.length,tabW=settings.tabWidth,txtH=settings.txtHeight,o=settings.grayOpacity; 15 | $focus.css({width:settings.width+(n-1)*tabW}); 16 | for(var i=0;i0) $picList[i].style.left=settings.width+(i-1)*tabW+'px'; 18 | $txtList[i].style.cssText=$txtBgList[i].style.cssText='top:0;height:'+txtH+'px;line-height:'+txtH+'px;' 19 | } 20 | if(settings.grayChange) $imgList.each(function(){$(this).setOpacity(o)}); 21 | //PLAY 22 | $focus.play(function(i,n){ 23 | $txtList.eq(i).slide({top:0}); 24 | if(settings.grayChange) $imgList.eq(i).slide({opacity:o},400); 25 | },function(i,n){ 26 | for(var j=0;j‹'); 11 | var $nextBtn=$focus.addHtml(''); 12 | //CSS 13 | var w=settings.width,h=settings.height,dotH=32,arrTop=h/2-32,n=$txtList.length; 14 | $focus[0].style.height=h+dotH+'px'; 15 | $picBox[0].style.cssText='width:'+w+'px;height:'+h+'px;'; 16 | $picUl[0].style.width=w*2*n+'px'; 17 | $txtList.each(function(){this.style.bottom=dotH+'px'}); 18 | $picUl.find('li').each(function(){this.style.cssText='width:'+w+'px;height:'+h+'px;'});//滑动固定其大小 19 | $prevBtn[0].style.cssText=$nextBtn[0].style.cssText='top:'+arrTop+'px;'; 20 | //PLAY 21 | $focus.play(function(i){ 22 | var index=i>=n?(i-n):i; 23 | $txtList[index].style.display='none'; 24 | $dotList[index].className = ''; 25 | },function(i){ 26 | var index=i>=n?(i-n):i; 27 | $picUl.slide({left:-w*i}); 28 | $txtList[index].style.display='block'; 29 | $dotList[index].className = 'current'; 30 | },settings.seamless); 31 | //Control 32 | $focus.bindControl($dotList); 33 | //Prev & Next 34 | $prevBtn.bind('click',function(){$focus.run('-=1')}); 35 | $nextBtn.bind('click',function(){$focus.run('+=1')}); 36 | } 37 | }); 38 | myFocus.config.extend({'mF_tbhuabao':{seamless:true}});//支持无缝设置 -------------------------------------------------------------------------------- /js/mf-pattern/mF_liuzg.js: -------------------------------------------------------------------------------- 1 | /* 2 | * 绚丽切片风格 v2.0 3 | * Date 2012.5.25 4 | * Author koen_lee 5 | */ 6 | myFocus.pattern.extend({ 7 | 'mF_liuzg':function(settings,$){ 8 | var $focus=$(settings); 9 | var $picBox=$focus.find('.pic'); 10 | var $picList=$picBox.find('li'); 11 | var $txtList=$focus.addListTxt().find('li'); 12 | var $numList=$focus.addListNum().find('li'); 13 | //HTML++ 14 | var c=Math.floor(settings.height/settings.chipHeight),n=$txtList.length,html=['
    ']; 15 | for(var i=0;i
    '); 17 | for(var j=0;j'); 19 | } 20 | html.push('
'); 21 | $picBox[0].innerHTML=html.join(''); 22 | //CSS 23 | var w=settings.width,h=settings.height,cH=Math.round(h/c); 24 | var $picList=$picBox.find('li'),$picDivList=$picBox.find('div'); 25 | $picList.each(function(i){ 26 | $picList.eq(i).css({width:w,height:cH}); 27 | $picDivList.eq(i).css({height:h*n,top:-i*h}); 28 | }); 29 | $picBox.find('a').each(function(){this.style.height=h+'px'}); 30 | //PLAY 31 | $focus.play(function(i){ 32 | $txtList[i].style.display='none'; 33 | $numList[i].className=''; 34 | },function(i){ 35 | var tt=settings.type||Math.round(1+Math.random()*2);//效果选择 36 | var dur=tt===1?1200:300; 37 | for(var j=0;j‹'); 11 | var $nextBtn=$focus.addHtml(''); 12 | //CSS 13 | var p=settings,showNum=p.thumbShowNum,thuBoxWidth=p.width-p.thumbBtnWidth*2,thuWidth=Math.round(thuBoxWidth/showNum),n=$picList.length; 14 | $focus[0].style.height=p.height+p.thumbHeight+'px'; 15 | $thumbBox.css({width:thuBoxWidth,height:p.thumbHeight,left:p.thumbBtnWidth}); 16 | $thumbUl.css({width:thuWidth*n}); 17 | $thumbList.each(function(){this.style.width=thuWidth+'px'}); 18 | $thumbBox.find('img').each(function(){this.style.height=(p.thumbHeight-13*2)+'px';});//10px margin+3px border 19 | $txtList.each(function(){this.style.bottom=p.thumbHeight+'px'}); 20 | //PLAY 21 | $focus.play(function(i){ 22 | $picList[i].style.display='none'; 23 | $txtList[i].style.display='none'; 24 | $thumbList[i].className = ''; 25 | },function(i){ 26 | $picList.eq(i).fadeIn(); 27 | $txtList[i].style.display='block'; 28 | $thumbList.scrollTo(i)[i].className = 'current'; 29 | }); 30 | //Control 31 | p.trigger='click';//让其仅支持'click'点击 32 | $focus.bindControl($thumbList); 33 | //Prev & Next 34 | $prevBtn.bind('click',function(){$focus.run('-=1')}); 35 | $nextBtn.bind('click',function(){$focus.run('+=1')}); 36 | } 37 | }); 38 | myFocus.config.extend({ 39 | 'mF_games_tb':{//可选个性参数 40 | thumbShowNum:4,//略缩图显示数目 41 | thumbBtnWidth:16,//略缩图导航(prev/next)按钮的宽度 42 | thumbHeight:86//略缩图总高度 43 | } 44 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_pithy_tb.css: -------------------------------------------------------------------------------- 1 | /*=========mF_pithy_tb========*/ 2 | .mF_pithy_tb_wrap{padding:8px;border:1px solid #999;float:left;background:#fff;}/*背景边框*/ 3 | .mF_pithy_tb{ position:relative;} 4 | .mF_pithy_tb .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 5 | .mF_pithy_tb .pic{position:absolute;top:0;left:0;} 6 | .mF_pithy_tb .pic ul{ position:absolute;} 7 | .mF_pithy_tb .pic ul li{width:100%;overflow:hidden;} 8 | .mF_pithy_tb .thumb{position:absolute;right:0;overflow:hidden;z-index:3;background:#fff;} 9 | .mF_pithy_tb .thumb ul{position:absolute;width:100%;top:0;} 10 | .mF_pithy_tb .thumb ul li{position:relative;overflow:hidden;cursor:pointer;*margin-bottom:-2px;} 11 | .mF_pithy_tb .thumb li a{display:block;padding:5px;margin-left:10px; border:1px solid #f1f1f1; border-left:0;} 12 | 13 | .mF_pithy_tb .thumb li.current{background:url(img/mF_pithy_tb/btn.gif) 3px center no-repeat;} 14 | .mF_pithy_tb .thumb li.current a{border-color:#ccc;} 15 | .mF_pithy_tb .thumb li b{position:absolute;width:100%;height:100%;background:#f1f1f1;top:0;left:10px;z-index:-1;} 16 | .mF_pithy_tb .txt li{position:absolute;z-index:2;bottom:0;width:100%;display:none;}/*默认标题高度*/ 17 | .mF_pithy_tb .txt li a{display:block;line-height:38px;position:relative;z-index:1;color:#fff;padding-left:16px;font-size:14px;font-weight:bold;text-decoration:none;}/*标题样式*/ 18 | .mF_pithy_tb .txt li b{display:block;height:100%;width:100%;position:absolute;top:0;left:0;background:#000;filter:alpha(opacity=30);opacity:0.3;} 19 | .mF_pithy_tb .prev,.mF_pithy_tb .next{overflow:hidden;position:absolute;z-index:4;right:0;cursor:pointer;background:#dedede; text-align:center;} 20 | .mF_pithy_tb .prev{top:0;} 21 | .mF_pithy_tb .next{bottom:0;} 22 | .mF_pithy_tb .prev-2,.mF_pithy_tb .next-2{width:23px;height:15px;overflow:hidden;position:absolute;z-index:4;bottom:12px;cursor:pointer;background:url(img/mF_pithy_tb/turn.gif) left top no-repeat;} 23 | .mF_pithy_tb .next-2{width:24px;background-position:right top;} 24 | -------------------------------------------------------------------------------- /js/mf-pattern/mF_rapoo.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************雷柏风格****************** 2 | 'mF_rapoo':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picList=$focus.find('.pic li'); 5 | var $txtBox=$focus.addListTxt(); 6 | var $txtList=$txtBox.find('li'); 7 | var $numBox=$focus.addListNum(); 8 | var $numList=$numBox.find('li'); 9 | var $prevBtn=$focus.addHtml(''); 10 | var $nextBtn=$focus.addHtml(''); 11 | //CSS 12 | var txtW=settings.txtWidth,n=$picList.length; 13 | $txtBox[0].style.width=(n-1)*24+txtW+'px'; 14 | $numBox[0].style.width=n*24+6+txtW+'px'; 15 | $prevBtn[0].style.right=parseInt($numBox[0].style.width)+26+'px'; 16 | for(var i=0;i'); 7 | var $thumbBox=$focus.addListThumb(); 8 | var $thumbUl=$thumbBox.find('ul'); 9 | var $thumbList=$thumbUl.find('li'); 10 | var $prevBtn=$focus.addHtml(''); 11 | var $nextBtn=$focus.addHtml(''); 12 | //CSS 13 | var p=settings,showNum=p.thumbShowNum,thuBoxWidth=p.width-p.thumbBtnWidth*2,thuWidth=Math.round(thuBoxWidth/showNum),n=$picList.length; 14 | $thumbBg.css({height:p.thumbHeight}); 15 | $thumbBox.css({width:thuBoxWidth,height:p.thumbHeight,left:p.thumbBtnWidth}); 16 | $thumbUl.css({width:thuWidth*n}); 17 | $thumbList.each(function(){this.style.width=thuWidth+'px'}); 18 | $thumbBox.find('img').each(function(){this.style.height=(p.thumbHeight-9*2)+'px';});//8px margin+1px border 19 | $txtList.each(function(){this.style.left=-settings.width+'px'}); 20 | //PLAY 21 | $focus.play(function(i,n){ 22 | $txtList.eq(i).stop().css({left:-settings.width}); 23 | $picList[i].style.display='none'; 24 | $thumbList[i].className=''; 25 | },function(i,n){ 26 | $picList.eq(i).fadeIn(300,function(){ 27 | $txtList.eq(i).slide({left:0}); 28 | }); 29 | $thumbList[i].className='current'; 30 | $thumbList.scrollTo(i); 31 | }); 32 | //Control 33 | p.trigger='click';//让其仅支持'click'点击 34 | $focus.bindControl($thumbList); 35 | //Prev & Next 36 | $prevBtn.bind('click',function(){$focus.run('-=1')}); 37 | $nextBtn.bind('click',function(){$focus.run('+=1')}); 38 | } 39 | }); 40 | myFocus.config.extend({ 41 | 'mF_fscreen_tb':{//可选个性参数 42 | thumbShowNum:4,//略缩图显示数目 43 | thumbBtnWidth:28,//略缩图导航(prev/next)按钮的宽度 44 | thumbHeight:72//略缩图总高度 45 | } 46 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_51xflash.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************51xflash(仅支持4帧)****************** 2 | 'mF_51xflash':function(settings,$){ 3 | var o=document.getElementById(settings.id),list=o.getElementsByTagName('li'); 4 | for(var j=0,len=list.length;j=4) list[j].parentNode.removeChild(list[j]); 6 | } 7 | var $focus=$(settings); 8 | var $picBox=$focus.find('.pic'); 9 | var $picUl=$picBox.find('ul'); 10 | var $picList=$picUl.find('li'); 11 | var $txtList=$focus.addListTxt().find('li'); 12 | var $playBtn=$focus.addHtml('
'); 13 | //CSS 14 | var pad=4,w=(settings.width/3),h=(settings.height-pad*2)/3,disX=w+pad,disY=h+pad,txtH=settings.txtHeight; 15 | $focus[0].style.cssText='width:'+(settings.width+disX)+'px;height:'+(settings.height+txtH+(txtH===0?0:pad))+'px;';//焦点图盒子 16 | $picBox[0].style.cssText='width:'+(settings.width+disX)+'px;height:'+settings.height+'px;';//图片盒子 17 | for(var i=0,n=$picList.length;i|'); 8 | var $prevBtn=$navBox.find('.prev'); 9 | var $nextBtn=$navBox.find('.next'); 10 | //CSS 11 | var d1=settings.width/2,d2=settings.height/2,txtH=settings.txtHeight; 12 | $focus[0].style.height=settings.height+txtH+'px'; 13 | //PLAY 14 | var s1,s2=1,first=true; 15 | switch(settings.turn){ 16 | case 'left' :s1=1,s2=1;break; 17 | case 'right':s1=1,s2=-1;break; 18 | case 'up' :s1=2,s2=1;break; 19 | case 'down' :s1=2,s2=-1;break; 20 | } 21 | $focus.play(null,function(next,n,prev){ 22 | $numList[prev].className='',$numList[next].className='current'; 23 | var tt=s1==1?1:(s1==2?2:Math.round(1+(Math.random()*(2-1)))),dis,d,p_s1={},p_s2={},p_e={}; 24 | dis=tt==1?d1:d2,d=s2*dis,p_s1[tt==1?'left':'top']=d,p_s2[tt==1?'left':'top']=-d,p_e[tt==1?'left':'top']=0; 25 | if(!first) $picList.eq(prev).stop().css({left:0,top:0,zIndex:3}); 26 | if(!first) $picList.eq(next).stop().css({left:0,top:0,zIndex:2}); 27 | $picList.eq(prev).slide(p_s2,300,'linear',function(){ 28 | $txtList[prev].style.display='none',this.style.zIndex=1; 29 | $(this).slide(p_e,800,function(){ 30 | this.style.zIndex=''; 31 | }); 32 | }); 33 | $picList.eq(next).slide(p_s1,300,'linear',function(){ 34 | $txtList[next].style.display='block',this.style.zIndex=3; 35 | $(this).slide(p_e,800); 36 | }); 37 | first=false; 38 | }); 39 | //Control 40 | $focus.bindControl($numList); 41 | //prev & next 42 | $prevBtn.bind('click',function(){$focus.run('-=1')}); 43 | $nextBtn.bind('click',function(){$focus.run('+=1')}); 44 | } 45 | }); 46 | myFocus.config.extend({ 47 | 'mF_kiki':{//可选个性参数 48 | turn:'random',//翻牌方向,可选：'left'(左)|'right'(右)|'up'(上)|'down'(下)|'random'(单向随机) 49 | txtHeight:30//标题默认高度 50 | } 51 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_fancy.css: -------------------------------------------------------------------------------- 1 | /*=========mF_fancy ========*/ 2 | .mF_fancy{ position:relative;} 3 | .mF_fancy .loading{ position:absolute; width:100%; height:100%; background:#fff url(img/loading.gif) center no-repeat; z-index:9;} 4 | .mF_fancy .pic{position:absolute;z-index:1;} 5 | .mF_fancy .pic ul{ position:absolute; top:0;left:0;width:x;height:100%; overflow:hidden;} 6 | .mF_fancy .pic ul li{ position:absolute;top:0;left:0; display:none; overflow:hidden;} 7 | .mF_fancy .txt{position:absolute;z-index:2; top:12px;left:12px; width:80%; color:#fff;} 8 | .mF_fancy .txt li{position:absolute;top:0;width:100%; padding:12px; visibility:hidden; opacity:0;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;} 9 | .mF_fancy .txt li a{display:block;color:#fff;font-size:14px;font-weight:bold;text-decoration:none; font-family:'微软雅黑';}/*标题样式*/ 10 | .mF_fancy .txt li p{ display:none;}/*隐藏详细描述文字*/ 11 | .mF_fancy .txt li.current{ visibility:visible; opacity:1;} 12 | .mF_fancy .num{ position:absolute;bottom:0;left:0;width:100%; overflow:hidden;} 13 | .mF_fancy .num ul{width:120%; background:#666; margin-left:-1px;} 14 | .mF_fancy .num ul li{ display:inline-block;*display:inline;*zoom:1; height:12px; border-left:1px solid #ddd; background:#666; overflow:hidden; cursor:pointer;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;} 15 | .mF_fancy .num ul li:hover{ background:#ddd;} 16 | .mF_fancy .num ul li.current{ background:#090909; cursor:default;} 17 | .mF_fancy .num ul li a{ display:none;} 18 | .mF_fancy .thumb{ position:absolute; left:0;bottom:40px; width:100%; z-index:9;} 19 | .mF_fancy .thumb ul{width:120%;} 20 | .mF_fancy .thumb ul li{display:inline-block!important;*display:inline!important;*zoom:1;width:x; position:relative; visibility:hidden; cursor:pointer;} 21 | .mF_fancy .thumb ul li img{ width:100%;} 22 | .mF_fancy .prev,.mF_fancy .next{font:700 53px/58px arial;width:37px;height:65px;overflow:hidden;position:absolute;z-index:9;left:0px;cursor:pointer; top:40%;} 23 | .mF_fancy .next{left:auto;right:0px;} 24 | .mF_fancy .prev a,.mF_fancy .next a{display:block;color:#fff;text-align:center;text-decoration:none;visibility:hidden; opacity:0;-webkit-transition:all .4s;-moz-transition:all .4s;-o-transition:all .4s;} 25 | .mF_fancy .prev a:hover,.mF_fancy .next a:hover{color:#f60;} 26 | .mF_fancy .show a{ visibility:visible; opacity:1;} -------------------------------------------------------------------------------- /js/mf-pattern/mF_pithy_tb.js: -------------------------------------------------------------------------------- 1 | myFocus.pattern.extend({//*********************pithy****************** 2 | 'mF_pithy_tb':function(settings,$){ 3 | var $focus=$(settings); 4 | var $picUl=$focus.find('.pic ul'); 5 | $picUl[0].innerHTML+=$picUl[0].innerHTML;//无缝复制 6 | var $picList=$picUl.find('li'); 7 | var $txtList=$focus.addListTxt().find('li'); 8 | var $thumbBox=$focus.addListThumb(); 9 | var $thumbUl=$thumbBox.find('ul'); 10 | var $thumbList=$thumbUl.find('li'); 11 | var $prevBtn=$focus.addHtml(''); 12 | var $nextBtn=$focus.addHtml(''); 13 | var $prevBtn2=$focus.addHtml('
'); 14 | var $nextBtn2=$focus.addHtml('
'); 15 | //CSS 16 | var p=settings, 17 | showNum=p.thumbShowNum, 18 | thuBoxHeight=p.height-p.thumbBtnHeight*2, 19 | thuHeight=Math.round(thuBoxHeight/showNum), 20 | n=$txtList.length; 21 | $focus[0].style.width=p.width+p.thumbWidth+'px'; 22 | $picList.each(function(){this.style.height=p.height+'px'}); 23 | $thumbBox.css({width:p.thumbWidth,height:thuBoxHeight,top:p.thumbBtnHeight}); 24 | $thumbList.each(function(){this.style.height=thuHeight+'px'}); 25 | $thumbBox.find('img').each(function(){$(this).css({height:thuHeight-12,width:p.thumbWidth-21})});//减去padding+margin+border 26 | $prevBtn[0].style.height=$nextBtn[0].style.height=p.thumbBtnHeight+'px';//暂时不用 27 | $prevBtn2.css({left:0.86*p.width}); 28 | $nextBtn2.css({left:0.86*p.width+23}); 29 | //PLAY 30 | $focus.play(function(i){ 31 | var index=i>=n?(i-n):i; 32 | $txtList[index].style.display='none'; 33 | $thumbList[index].className = ''; 34 | },function(i){ 35 | var index=i>=n?(i-n):i; 36 | $picUl.slide({top:-settings.height*i},600); 37 | $txtList[index].style.display='block'; 38 | $thumbList.scrollTo(index)[index].className = 'current'; 39 | },p.seamless); 40 | //Control 41 | p.trigger='click';//trigger限定为click 42 | $focus.bindControl($thumbList); 43 | //Prev & Next 44 | $prevBtn2.bind('click',function(){$focus.run('-=1')}); 45 | $nextBtn2.bind('click',function(){$focus.run('+=1')}); 46 | } 47 | }); 48 | myFocus.config.extend({ 49 | 'mF_pithy_tb':{//可选个性参数 50 | seamless:true,//是否无缝，可选：true(是) | false(否) 51 | txtHeight:38,//标题高度 52 | thumbShowNum:4,//略缩图显示数目 53 | thumbBtnHeight:0,//略缩图导航(prev/next)按钮的高度 54 | thumbWidth:112//略缩图总宽度 55 | } 56 | }); -------------------------------------------------------------------------------- /js/mf-pattern/mF_fancy.js: -------------------------------------------------------------------------------- 1 | /* 2 | * fancy v1.0 3 | * Date 2012.5.8 4 | * Author koen_lee 5 | */ 6 | myFocus.pattern.extend({ 7 | 'mF_fancy':function(settings,$){ 8 | var $focus=$(settings); 9 | var $txtList=$focus.addListTxt().find('li'); 10 | var $numList=$focus.addListNum().find('li'),n=$numList.length; 11 | var $thumbList=$focus.addListThumb().find('li'); 12 | var $picUls=$focus.find('.pic ul').repeat(n); 13 | var $prevBtn=$focus.addHtml(''); 14 | var $nextBtn=$focus.addHtml(''); 15 | var $picListArr=[]; 16 | //CSS 17 | var w=Math.round(settings.width/n); 18 | $picUls.each(function(i){ 19 | $(this).css({width:w*(i+1),zIndex:n-i}); 20 | $picListArr.push($(this).find('li')); 21 | }); 22 | var numW=Math.round((settings.width-n+1)/n); 23 | $numList.each(function(i){ 24 | this.style.width=numW+'px'; 25 | if(i===(n-1)) this.style.width=numW+1+'px';//最后一个加1px 26 | $thumbList.eq(i)[0].style.width=w+'px'; 27 | }); 28 | $focus[0].style.height=settings.height+12+'px'; 29 | //PLAY 30 | var params={isRunning:false},done=0;//记录运行状态 31 | var eff={1:'surf',2:'sliceUpDown',3:'fold',4:'sliceDown',5:'fade',6:settings.effect};//过渡效果列表 32 | var effIndex=eff[6]==='random'?0:6; 33 | $focus.play(function(i){ 34 | params.isRunning=true; 35 | $numList[i].className=''; 36 | $txtList[i].className=''; 37 | },function(i){ 38 | $numList[i].className='current'; 39 | $txtList[i].className='current'; 40 | var r=effIndex||(1+Math.round(Math.random()*4)); 41 | for(var j=0;j 2 | 3 | 4 | 5 | 6 | 企业网站制作 7 | 8 | 9 | 17 | 18 | 19 | 20 |
21 |
22 | 27 |
28 |
29 |
30 | 39 |
40 |
41 |
42 |
43 | 51 |
52 |
53 |
54 | 55 |
56 |
57 |
58 |
59 |
60 |
61 | 64 | 65 | 66 | 68 |
    • 69 | 70 | 71 |
    72 |
    73 |
    74 |

    新闻中心

    75 |
    76 | 85 |
    86 |
    87 |
    88 |

    新闻中心

    89 |
    90 | 108 |
    109 |
    110 | 首页<123...>末页 111 |
    112 |
    113 |
    114 |
    115 |
    116 |
    117 |
      118 |
    • 关于 119 |
        120 |
      • 品牌故事
        • 121 |
      • 联系我们
        • 122 |
      • 加入我们
        • 123 |
      • 版权声明
        • 124 |
      125 |
      • 126 |
    • 课程 127 |
        128 |
      • PHP开发
        • 129 |
      • 前端开发
        • 130 |
      • JAVA开发
        • 131 |
      • Android开发
        • 132 |
      133 |
      • 134 |
    • 关注 135 |
        136 |
      • 新浪微博
        • 137 |
      • 腾讯微博
        • 138 |
      • 企业微信
        • 139 |
      • QQ空间
        • 140 |
      141 |
      • 142 |
    • 留言 143 |
        144 |
      • 意见反馈
        • 145 |
      • 问题留言
        • 146 |
      • 媒体联络
        • 147 |
      • 在线客服
        • 148 |
      149 |
      • 150 |
    • 微信关注微信关注 151 |
        152 |
      • 扫描关注慕课网官方微信
        • 153 |
      154 |
      • 155 |
    156 |
    157 |
    158 | 159 | 160 | -------------------------------------------------------------------------------- /news.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 企业网站制作 7 | 8 | 9 | 10 | 11 |
    12 |
    13 | 18 |
    19 |
    20 |
    21 | 30 |
    31 |
    32 |
    33 |
    34 | 42 |
    43 |
    44 |
    45 | 46 |
    47 |
    48 |
    49 |
    50 |
    51 |
    52 |
    • 53 |
    54 |
    55 |
    56 |

    新闻中心

    57 |
    58 | 67 |
    68 |
    69 |
    70 |

    新闻中心

    71 |

    【有奖活动】给父亲的三行书信

    72 |

    发布人：Admin 发布时间：2014-06-01 浏览：3246次

    73 |
    74 |

    8月伊始，慕课网App即获得了App 75 | Store的多个推荐，同时出现在“免费App精选”、“致毕业生”、“学而不倦”以及“轻松学编程”四个榜单中。这款IT编程学习类的App为何如此备受青睐？趣味视频课程、高清画面质感、在线离线随身学习……优质的课程内容结合良好的用户体验，慕课网App无疑是IT学习的最佳选择。 76 |

    77 |

    App Store力荐 慕课网荣登四榜单

    78 |

    App 79 | Store因公平著称，能被其推荐是每一款App梦寐以求的荣誉，慕课网则一举占据了其四个榜单，包括精品推荐首页“合集”版块下“免费App精选”中的“新品”推荐、“合集”版块“致毕业生”中“学无止境”推荐、教育类别“合集”版块下“学而不倦”中的推荐以及“轻松学编程”版块推荐。 80 |

    81 |

    82 |

    事实上，慕课网登上App Store榜单并非首次。早在2014年5月，慕课网就荣登App Store 83 | 精品推荐榜首，同时登上“教育”类别下“优秀新App”榜首，并获评“五月最佳”精彩App。随后，慕课网App接连出现在“致毕业生”、“免费App精选”、“夏日学堂”等榜单中。

    84 |

    从App Store的持续推荐以及“优秀”、“精选”的肯定中不难看出，慕课网在IT在线学习领域以及教育类App中得到了用户的认可。

    85 |

    新功能上线 持续提升用户体验

    86 |

    一款好的产品同样需要不断改进来满足用户需求。慕课网App上线至今进行了多个版本的迭代，不断完善产品、提升用户体验，ios最新的2.1.0版本于7月20日更新，上线了大量新功能。

    87 |

    明确、清晰的课程分类能够让用户迅速找到感兴趣的课程，本次慕课网就上线了全新的课程分类方式，点击“全部课程”即可显示出全部的技术语言种类以及视频课程数量，全部在线课程一目了然。

    88 |

    不知道讲师在哪里？此版本更新中添加了讲师认证，不仅对讲师空间进行了认证，在课程讨论和笔记中，通过认证标识，一眼可以看到哪个是讲师回复。

    89 |

    此外，慕课网App在最新版本中调整了下拉刷新和上拉加载的效果；课程练习部分增加了习题解析；对半透化效果、全屏播放器按钮进行了优化，并新增了编程课、ps课程。一系列的改进相信能为IT学习用户带来更好的学习体验。 90 |

    91 |

    慕课网App在精品视频课程的基础上，不断优化用户体验，帮助IT学习者迅速入门、提升技能，以优秀的产品基因获得App 92 | Store的多个推荐，使更多用户有机会使用这款IT学习软件，体验学习的简单和快捷。

    93 |
    94 | 97 |
    98 |
    99 |
    100 |
    101 |
    102 |
      103 |
    • 关于 104 |
        105 |
      • 品牌故事
        • 106 |
      • 联系我们
        • 107 |
      • 加入我们
        • 108 |
      • 版权声明
        • 109 |
      110 |
      • 111 |
    • 课程 112 |
        113 |
      • PHP开发
        • 114 |
      • 前端开发
        • 115 |
      • JAVA开发
        • 116 |
      • Android开发
        • 117 |
      118 |
      • 119 |
    • 关注 120 |
        121 |
      • 新浪微博
        • 122 |
      • 腾讯微博
        • 123 |
      • 企业微信
        • 124 |
      • QQ空间
        • 125 |
      126 |
      • 127 |
    • 留言 128 |
        129 |
      • 意见反馈
        • 130 |
      • 问题留言
        • 131 |
      • 媒体联络
        • 132 |
      • 在线客服
        • 133 |
      134 |
      • 135 |
    • 微信关注微信关注 136 |
        137 |
      • 扫描关注慕课网官方微信
        • 138 |
      139 |
      • 140 |
    141 |
    142 |
    143 | 144 | 145 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 企业网站制作 7 | 8 | 9 | 10 | 11 | 12 | 17 | 18 | 19 | 20 |
    21 |
    22 | 27 |
    28 |
    29 |
    30 | 39 |
    40 |
    41 |
    42 |
    43 | 51 |
    52 |
    53 |
    54 | 55 |
    56 |
    57 |
    58 |
    59 |
    60 |
    61 |
    62 | 图片加载中 63 |
    64 |
    65 |
      66 |
      • 67 |
      • 68 |
      • 69 |
    70 |
    71 |
    72 |
    73 |
    74 |
    75 |

    新闻中心

    76 | 77 | More>> 78 | 79 |
    80 |
    81 | 82 |

    83 | 慕女神喊你来表白！ 84 |

    85 |

    86 | 活动时间：5月20日—5月25日
    87 | 获奖公布时间：5月26日
    88 | Learn More>> 89 |

    90 |
    91 |
    92 | 110 |
    111 |
    112 | 113 |
    114 |
    115 |

    课程中心

    116 | More>> 117 |
    118 |
    119 | 120 |

    121 | CSS圆角进化论 122 |

    123 |

    CSS圆角的实现，经历了三大发展阶段：背景图片方式、CSS2.0+HTML标签模拟、CSS3.0圆角属性）。本案例详细讲解每一种的实现方式，并对实现的优缺点进行对比分析。

    124 |
    125 |
    126 |
      127 |
    • PHP开发
      • 128 |
    • 前端开发
      • 129 |
    • JAVA开发
      • 130 |
    • Android开发
      • 131 |
    132 |
    133 |
    134 |
    135 |
    136 |
    137 |

    媒体聚焦

    138 |
    139 |
    140 | 142 |
    143 |
    144 |
    145 | 146 |
    147 |
    148 |
    149 |
    150 |
    151 |
    152 |
      153 |
    • 关于 154 |
        155 |
      • 品牌故事
        • 156 |
      • 联系我们
        • 157 |
      • 加入我们
        • 158 |
      • 版权声明
        • 159 |
      160 |
      • 161 |
    • 课程 162 |
        163 |
      • PHP开发
        • 164 |
      • 前端开发
        • 165 |
      • JAVA开发
        • 166 |
      • Android开发
        • 167 |
      168 |
      • 169 |
    • 关注 170 |
        171 |
      • 新浪微博
        • 172 |
      • 腾讯微博
        • 173 |
      • 企业微信
        • 174 |
      • QQ空间
        • 175 |
      176 |
      • 177 |
    • 留言 178 |
        179 |
      • 意见反馈
        • 180 |
      • 问题留言
        • 181 |
      • 媒体联络
        • 182 |
      • 在线客服
        • 183 |
      184 |
      • 185 |
    • 微信关注微信关注 186 |
        187 |
      • 扫描关注慕课网官方微信
        • 188 |
      189 |
      • 190 |
    191 |
    192 |
    193 | 194 | 195 | -------------------------------------------------------------------------------- /css/main.css: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | font-size: 12px; 7 | } 8 | 9 | body { 10 | background-color: #f5f5f5; 11 | } 12 | 13 | .top { 14 | width: 100%; 15 | height: 27px; 16 | background: url(../images/top_bg.jpg) repeat-x; 17 | } 18 | 19 | .top_content { 20 | width: 1000px; 21 | margin: 0 auto; 22 | } 23 | 24 | .top_content li { 25 | list-style-image: url(../images/li_bg.gif); 26 | float: right; 27 | width: 70px; 28 | line-height: 27px; 29 | } 30 | 31 | .top_content a:link, .top_content a:visited { 32 | color: #8e8e8e; 33 | text-decoration: none; 34 | } 35 | 36 | .top_content a:hover, .top_content a:active { 37 | color: #900000; 38 | text-decoration: none; 39 | } 40 | 41 | .wrap { 42 | width: 1000px; 43 | margin: 0 auto; 44 | } 45 | 46 | .logo { 47 | height: 80px; 48 | background-color: #ffffff; 49 | overflow: hidden; 50 | } 51 | 52 | .logo_left { 53 | width: 200px; 54 | float: left; 55 | } 56 | 57 | .logo_right { 58 | width: 300px; 59 | float: right; 60 | height: 28px; 61 | margin-top: 30px; 62 | color: #8e8e8e; 63 | } 64 | 65 | .logo_right img { 66 | vertical-align: middle; 67 | margin-right: 10px; 68 | } 69 | 70 | .tel { 71 | font-family: "微软雅黑"; 72 | font-size: 16px; 73 | color: #c00000; 74 | } 75 | 76 | .nav { 77 | height: 40px; 78 | } 79 | 80 | .nav_left { 81 | width: 10px; 82 | background: url(../images/nav_left.jpg) no-repeat; 83 | } 84 | 85 | .nav_mid { 86 | width: 980px; 87 | background: url(../images/nav_bg.jpg) repeat-x; 88 | /* background: url(../images/nav_mid.jpg) repeat-x; */ 89 | } 90 | 91 | .nav_right { 92 | width: 10px; 93 | background: url(../images/nav_right.jpg) no-repeat; 94 | } 95 | 96 | .nav_left, .nav_mid, .nav_right { 97 | float: left; 98 | height: 40px; 99 | } 100 | 101 | .nav_mid_left, .nav_mid_right { 102 | float: left; 103 | } 104 | 105 | .nav_mid_left { 106 | width: 680px; 107 | } 108 | 109 | .nav_mid_right { 110 | width: 300px; 111 | } 112 | 113 | .nav_mid_left li { 114 | float: left; 115 | list-style-type: none; 116 | width: 100px; 117 | text-align: center; 118 | line-height: 40px; 119 | } 120 | 121 | .nav_mid_left a:link, .nav_mid_left a:visited { 122 | text-decoration: none; 123 | color: #722828; 124 | font-size: 16px; 125 | font-family: "微软雅黑"; 126 | } 127 | 128 | .nav_mid_left a:hover, .nav_mid_left a:active { 129 | text-decoration: none; 130 | color: #3d7228; 131 | font-size: 16px; 132 | font-family: "微软雅黑"; 133 | } 134 | 135 | .search_text { 136 | width: 190px; 137 | height: 25px; 138 | margin-top: 5px; 139 | background: url(../images/search.jpg) no-repeat right center; 140 | padding-right: 25px; 141 | border: 1px solid #ffffff; 142 | background-color: #ffffff; 143 | } 144 | 145 | .ad { 146 | height: 310px; 147 | overflow: hidden; 148 | } 149 | 150 | .main { 151 | height: 250px; 152 | background-color: #ffffff; 153 | overflow: hidden; 154 | margin-top: 5px; 155 | } 156 | 157 | .news { 158 | width: 340px; 159 | border: 1px solid #e8e8e8; 160 | } 161 | 162 | .course { 163 | width: 410px; 164 | border: 1px solid #e8e8e8; 165 | margin: 0 7px; 166 | /* background-color: #ffff66; */ 167 | } 168 | 169 | .sidebar { 170 | width: 230px; 171 | } 172 | 173 | .news, .course, .sidebar { 174 | height: 250px; 175 | float: left; 176 | } 177 | 178 | .title { 179 | height: 35px; 180 | border-bottom: 2px solid #e8e8e8; 181 | /* overflow: hidden; */ 182 | } 183 | 184 | .title_left { 185 | width: 70%; 186 | font-family: "微软雅黑"; 187 | font-size: 14px; 188 | font-weight: bold; 189 | color: #786f66; 190 | float: left; 191 | line-height: 35px; 192 | padding-left: 20px; 193 | } 194 | 195 | .title_right { 196 | width: 20%; 197 | float: right; 198 | line-height: 35px; 199 | text-align: right; 200 | padding-right: 10px; 201 | } 202 | 203 | .title_right a { 204 | text-decoration: none; 205 | color: #999999; 206 | } 207 | 208 | .pic_news { 209 | height: 85px; 210 | margin-top: 5px; 211 | overflow: hidden; 212 | line-height: 22px; 213 | } 214 | 215 | .pic_news img, .course_pic img { 216 | float: left; 217 | margin: 0 5px; 218 | } 219 | 220 | .pic_news a, .course_pic a { 221 | color: #c00; 222 | text-decoration: none; 223 | } 224 | 225 | .news_list { 226 | margin-top: 20px; 227 | } 228 | 229 | .news_list li { 230 | list-style-type: none; 231 | background: url(../images/list.jpg) no-repeat; 232 | /* margin-left: 10px; */ 233 | padding-left: 10px; 234 | margin: 8px; 235 | border-bottom: 1px dotted #ccc; 236 | overflow: hidden; 237 | } 238 | 239 | .news_list a:link, .news_list a:visited { 240 | text-decoration: none; 241 | color: #000; 242 | } 243 | 244 | .news_list a:hover, .news_list a:active { 245 | text-decoration: none; 246 | color: #f00; 247 | } 248 | 249 | .news_list span { 250 | color: #999; 251 | float: right; 252 | } 253 | 254 | .course_pic { 255 | height: 120px; 256 | margin-top: 10px; 257 | line-height: 22px; 258 | } 259 | 260 | .course_type { 261 | height: 37px; 262 | width: 372px; 263 | background: url(../images/product_type_bg.jpg) no-repeat; 264 | margin: 20px auto; 265 | } 266 | 267 | .course_type li { 268 | list-style-type: none; 269 | float: left; 270 | line-height: 37px; 271 | margin: 0 15px; 272 | text-align: center; 273 | } 274 | 275 | .video { 276 | height: 185px; 277 | border: 1px solid #e8e8e8; 278 | } 279 | 280 | .video_content { 281 | height: 150px; 282 | } 283 | 284 | .sidebar_ad { 285 | height: 55px; 286 | border: 1px solid #e8e8e8; 287 | margin-top: 5px; 288 | } 289 | 290 | .copyright { 291 | width: 100%; 292 | height: 200px; 293 | background-color: #e8e8e8; 294 | } 295 | 296 | .copyright_content { 297 | width: 1000px; 298 | margin: 0 auto; 299 | padding-top: 20px; 300 | } 301 | 302 | .copyright_content li { 303 | list-style-type: none; 304 | float: left; 305 | width: 200px; 306 | background: url(../images/line.png) no-repeat right center; 307 | text-align: center; 308 | line-height: 30px; 309 | font-family: "微软雅黑"; 310 | } 311 | 312 | .copyright_content a { 313 | text-decoration: none; 314 | color: #999; 315 | font-size: 18px; 316 | } 317 | 318 | .copyright_content li ul li a { 319 | font-size: 14px; 320 | } 321 | 322 | .list_main { 323 | min-height: 350px; 324 | _height: 350px; 325 | background-color: #FFF; 326 | margin-top: 10px; 327 | overflow: hidden; 328 | } 329 | 330 | .news_type { 331 | width: 220px; 332 | height: 350px; 333 | border: 1px solid #e8e8e8; 334 | /* background-color: #9fc; */ 335 | float: left; 336 | } 337 | 338 | .news_type h2 { 339 | height: 35px; 340 | line-height: 35px; 341 | font-size: 14px; 342 | font-family: "微软雅黑"; 343 | color: #666666; 344 | background: url(../images/titile_bg.gif) repeat-x; 345 | padding-left: 20px; 346 | } 347 | 348 | .new_type_contents { 349 | height: 365px; 350 | background: url(../images/content_bg.gif) repeat-x; 351 | } 352 | 353 | .new_type_contents li { 354 | list-style-type: none; 355 | height: 30px; 356 | line-height: 30px; 357 | } 358 | 359 | .new_type_contents li a { 360 | color: #666666; 361 | text-decoration: none; 362 | background: url(../images/li_bg.gif) no-repeat left center; 363 | padding-left: 15px; 364 | display: block; 365 | } 366 | 367 | .new_type_contents li a:hover { 368 | color: #009CDF; 369 | background: url(../images/li_bg2.gif) no-repeat left center; 370 | background-color: #f2f2f2; 371 | } 372 | 373 | .list_box { 374 | width: 770px; 375 | min-height: 350px; 376 | _height: 350px; 377 | background-color: #ffffff; 378 | border: 1px solid #e8e8e8; 379 | float: right; 380 | } 381 | 382 | .list_box h1 { 383 | font-family: "微软雅黑"; 384 | font-size: 20px; 385 | text-align: center; 386 | margin: 10px 0; 387 | } 388 | 389 | .list_box h2 { 390 | font-size: 14px; 391 | font-family: "微软雅黑"; 392 | color: #666666; 393 | height: 35px; 394 | line-height: 35px; 395 | background: url(../images/type_bg.png) repeat-x; 396 | padding-left: 20px; 397 | } 398 | 399 | .page { 400 | height: 40px; 401 | margin-top: 10px; 402 | text-align: center; 403 | } 404 | 405 | .page a { 406 | display: inline-block; 407 | border: 1px solid #e8e8e8; 408 | text-decoration: none; 409 | margin: 5px; 410 | padding: 5px 10px; 411 | } 412 | 413 | .page a:link, .page a:visited { 414 | color: #000000; 415 | } 416 | 417 | .page a:hover, .page a:active { 418 | color: #ffffff; 419 | background-color: #cc1b1b; 420 | } 421 | 422 | .list_box_newsInfo { 423 | color: #666666; 424 | text-align: center; 425 | border-bottom: 1px dotted #666666; 426 | } 427 | 428 | .list_box_newsContent { 429 | font-size: 14px; 430 | padding: 20px; 431 | line-height: 25px; 432 | text-indent: 2em; 433 | } -------------------------------------------------------------------------------- /js/myfocus-2.0.4.min.js: -------------------------------------------------------------------------------- 1 | /*! myFocus v2.0.4 | https://github.com/koen301/myfocus */ 2 | eval(function(p,a,c,k,e,r){e=function(c){return(c35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('(6(){7 q=6(a){9 P a===\'1O\'?W.4c(a):a},$M=6(a,b){9(q(b)||W).3G(a)},$3F=6(a,b){9 $2H(a,b,\'M\')},$18=6(a,b){7 c=$M(\'*\',b),1f=[];B(7 i=0,l=c.K;i\':12=y;15;1o\'.\':7 g=s.2h(1);7 h=12?$3o:$18;$(c).1B(6(){f=f.4K(h(g,3))});12=D;15;1o\'#\':7 j=s.2h(1),e=q(j);8(e)f.z(q(j));12=D;15;2w:7 h=12?$3F:$M,2f=s.40(\'.\');7 k=2f[0],g=2f[1];$(c).1B(6(){7 a=h(k,3);B(7 i=0,v=a.K;i+~,(\\[\\\\]+)+|[>+~])(\\s*,\\s*)?/g;7 c=[],m;5j((m=b.3Z(a))!==1g){c.z(m[1])}9 c},22:6(a){7 o=3[0],e=W.1D(\'T\');e.Q=a;7 b=e.39;o.1d.4d(b,o);b.1L(o);9 3},2U:6(a){7 b=3[0];7 e=W.1D(\'T\');e.Q=a;7 c=e.4C[0];b.1L(c);9 u(c)},1N:6(a,b){7 c=3.1q,n=3.1W;7 d=[\'<1i>\'];B(7 i=0;i\'+(i+1)+\'\';15;1o\'1Q\':Y=e?c[i].Q.1r(/\\<11(.|\\n|\\r)*?\\>/i,e.30)+\'

    \'+e.1l("1k")+\'

    \':\'\';15;1o\'1t\':Y=e?\'<11 U=\'+(e.1l("1t")||e.U)+\' />\':\'\';15;2w:Y=\'\'}d.z(\'<1h>\'+Y+\'\')}d.z(\'    \');9 3.2U(d.1u(\'\'))},4e:6(a){9 3.1N(a||\'2t\',\'2t\')},4j:6(a){9 3.1N(a||\'1Q\',\'1Q\')},4m:6(a){9 3.1N(a||\'1t\',\'1t\')},3C:6(){7 o=3[0];8(o)o.1d.4y(o)},4A:6(n){7 n=n||2,1Z=3[0].1d,Y=1Z.Q,s=[];B(7 i=0;i0?\'3V\':\'3W\',1n=\'32\'+a,2g=k[2S?\'3a\':\'3g\'],34=(1b 38)*1;o[1n]&&1R(o[1n]);o[1n]=2i(6(){7 t=(1b 38)-34;8(t<=d){2g.L(k,e(t,b,c,d),a,m)}E{2g.L(k,b+c,a,m);1R(o[1n]),o[1n]=1g;j&&j.L(o)}},13);9 3},4b:6(a,b,c){8(P a!==\'1P\')c=a,a=3c;8(P b===\'6\')c=b,b=\'\';3.1X(\'V\',1,a,b||\'2j\',6(){u(3).C({2k:\'4f\',V:0})},c);9 3},4h:6(a,b,c){8(P a!==\'1P\')c=a,a=3c;8(P b===\'6\')c=b,b=\'\';3.1X(\'V\',0,a,b||\'2j\',1g,6(){3.S.2k=\'2l\';c&&c.L(3)});9 3},3v:6(a,b,c,d){8(P b!==\'1P\')d=b,b=4k;8(P c===\'6\')d=c,c=\'\';B(7 p 25 a)3.1X(p,a[p],b,c||\'2m\',1g,d);9 3},4l:6(){7 o=3[0];B(7 p 25 o)8(p.3z(\'32\')!==-1)o[p]&&1R(o[p]);9 3},2W:{2j:6(t,b,c,d){9 c*t/d+b},4n:6(t,b,c,d){9-c/2*(20.4o(20.4p*t/d)-1)+b},4r:6(t,b,c,d){9 c*(t/=d)*t*t*t+b},2m:6(t,b,c,d){9-c*((t=t/d-1)*t*t*t-1)+b},4t:6(t,b,c,d){9((t/=d/2)<1)?(c/2*t*t*t*t+b):(-c/2*((t-=2)*t*t*t-2)+b)}}});u.R.N({14:6(a,b){u.2n(3[0],a,b);9 3},4z:6(b,c,d){7 f=3,p=f.2q,n=f.1W,t=p.2Z*3D,d=d||D,1H=u(f.1q).C(\'1H\'),1p=1H===\'1y\',2p=1p?\'1y\':\'1e\',1A=1p?p.O:p.x,1v=0,I=p.1x;f.21(\'.2T\').3C();f.1w=6(a){b&&b(1v,n);I=P a===\'1O\'?1v+4U(a.1r(\'=\',\'\')):a;8(I<=-1){I=n-1;8(d)f.1q[0].1d.S[2p]=-n*1A+\'J\'}8(I>=n){8(!d)I=0;8(I>=2*n){f.1q[0].1d.S[2p]=-(n-1)*1A+\'J\';I=n}}8(d&&1v>=n&&I1){f.1I=2i(6(){f.1w(\'+=1\')},t);f.14(\'24\',6(){1R(f.1I);f.1I=\'31\'}).14(\'2v\',6(){8(!f.5w&&f.1I===\'31\')f.1I=2i(6(){f.1w(\'+=1\')},t)})}f.21(\'a\').1B(6(){3.5B=6(){3.3T()}})},3U:6(a,b){7 c=3,p=c.2q,1s=p.2B,1F=p.1F,2x=b||{},1Y=2x.36||p.36;7 d=6(){8(3.1x!==c.2V&&!2x.3Y){c.1w(3.1x);9 D}};a.1B(6(i){3.1x=i;7 o=3,$o=u(o);8(1s===\'2z\'){$o.14(\'24\',6(){$o.2b(\'37\')}).14(\'2v\',6(){$o.3x(\'37\')}).14(\'2z\',d)}E 8(1s===\'24\'){$o.14(\'24\',6(){8(1F===0)d.L(o);E a.2y=1M(6(){d.L(o)},1F)}).14(\'2v\',6(){a.2y&&41(a.2y)})}E{42(\'u 43 44(2B) : \\"\'+1s+\'\\"\');9 D}});8(1Y){7 e=a.C(\'1H\'),1p=e===\'1y\'||e===\'45\';a.1V=1p?\'1y\':\'1e\';a.n=c.1W;a.2A=1Y;a.1a=p.1x;a.1J=a.1a+1Y-1;a.1A=a.C(1p?\'O\':\'x\');a.3d=a.3L()}},49:6(i,a){7 n=3.n,1V=3.1V,$1i=3.3d,C={};8(i>=3.1J){3.1J=i0?i-1:0;3.1J=3.1a+3.2A-1}C[1V]=-3.1a*3.1A;$1i.3v(C,a||4a,\'2m\');9 3}});u.N({3e:6(p,c){7 F=3,H=p.H,17=F.3h(H);p.G=p.G||F.2C.G;p.1c=p.G+\'4g\'+H;F.2n(2E,\'4i\',6(){F.2F=y});F.3l(p,6(){p=F.N({},F.2C,F.2o[p.G],p);F.3m(p,6(){7 b=F(q(H));p.$o=b;p.2r&&F.3n(p);p.19=$18(\'19\',b[0])[0];p.O=p.O||b.C(\'O\'),p.x=p.x||b.C(\'x\');F.3p(p,17);b.2b(p.G+\' \'+p.1c);F.3q(p,6(a){8(p.28)F.3r(p,a);F.G[p.G](p,F);c&&c()})})})},2F:D,3l:6(p,a){8(3.G[p.G]){a();9}7 b=3.3s()+\'4q-G/\'+p.G;7 c=W.1D("3t"),C=W.1D("4s"),U=b+\'.3u\',1z=b+\'.C\';c.1s="1k/4v",c.U=U;C.4w="4x",C.1z=1z;7 d=$M(\'3w\')[0],26=D,3y=10*3D;d.1L(C);d.1L(c);c.2I=c.3A=6(){8(26)9;8(!c.2J||c.2J=="4E"||c.2J=="4F"){26=y;a();c.2I=c.3A=1g}};1M(6(){8(!26)q(p.H).Q=\'加载失败: \'+U},3y)},3s:6(){7 a=\'\';7 b=$M("3t");B(7 i=0,v=b.K;i=1m/16){7 c=1m,x=1m/w*h,1e=(16-x)/2}E{7 c=16/h*w,x=16,1e=0}b[i].S.27=\';O:\'+c+\'J;x:\'+x+\'J;3H-1e:\'+1e+\'J;\'}},3p:6(p,a){7 b=[],w=p.O||\'\',h=p.x||\'\';8(p.19){b.z(\'.\'+p.1c+\' *{3H:0;4R:0;4S:0;4T-S:2l;}.\'+p.1c+\'{3I:3J;O:\'+w+\'J;x:\'+h+\'J;2N:2O;4Y:4Z/1.5 50;1k-3M:1y;52:#53;54:55!3N;}.\'+p.1c+\' .19{3I:3J;O:\'+w+\'J;x:\'+h+\'J;2N:2O;}.\'+p.1c+\' .1Q 1h{O:\'+w+\'J;x:\'+p.35+\'J!3N;2N:2O;}\');8(p.22)p.$o.22(\'\');8(p.28)b.z(\'.\'+p.1c+\' .19 1h{1k-3M:58;O:\'+w+\'J;x:\'+h+\'J;}\')}1T{a.3O.27=b.1u(\'\')}1S(e){a.Q=b.1u(\'\')}},3h:6(a){7 s=\'#\'+a+\' *{2k:2l}\',17=W.1D(\'S\');17.1s=\'1k/C\';1T{17.3O.27=s}1S(e){17.Q=s}7 b=$M(\'3w\',W)[0];b.5a(17,b.39);9 17}});u.N({1j:!!(W.5b&&5c.5d.3z(\'5e\')===-1),2n:6(o,a,b){7 c=3.1j,e=c?\'5f\':\'5g\',t=(c?\'5h\':\'\')+a;o[e](t,6(e){7 e=e||2E.5i,3P=b.L(o,e);8(3P===D){8(c)e.5k=y,e.5l=D;E e.5m(),e.5n()}},D)},3n:6(p){7 a=2E.3Q?1b 3Q():1b 5p("5q.5r");a.5s("5t",p.2r+"?"+20.5u(),D);a.5v(1g);3.3R(a.5x,p)},3R:6(a,p){7 b=a.5y.3G("2Q"),v=b.K;7 c=[\'<1i>\'];B(7 i=0;i<11 U="\'+b[i].1l(\'5z\')+\'" 1t="\'+b[i].1l(\'1t\')+\'" 30="\'+b[i].1l(\'5A\')+\'" 1k="\'+b[i].1l(\'1k\')+\'" />\')}c.z(\'\');p.$o[0].Q=c.1u(\'\')}});8(P 3S!==\'2a\'){3S.R.N({u:6(p,a){8(!p)p={};p.H=3[0].H;8(!p.H)p.H=3[0].H=\'4u\';u.3e(p,a)}})}})();',62,349,'|||this|||function|var|if|return|||||||||||||||||||||myFocus|len||height|true|push||for|css|false|else||pattern|id|indexCurrent|px|length|call|tag|extend|width|typeof|innerHTML|fn|style|div|src|opacity|document|value|html|||img|isChild||bind|break|boxHeight|oStyle|class|pic|showStart|new|__clsName|parentNode|top|arr|null|li|ul|isIE|text|getAttribute|boxWidth|timerId|case|isLevel|HTMLUList|replace|type|thumb|join|indexLast|run|index|left|href|distance|each|doms|createElement|dest|delay|prototype|float|runTimer|showEnd|Array|appendChild|setTimeout|addList|string|number|txt|clearInterval|catch|try|constr|dir|HTMLUListLength|animate|tsNum|pNode|Math|find|wrap|className|mouseover|in|isSuccess|cssText|autoZoom|auto|undefined|addClass|cls|continue|diffValue|sArr|setProperty|slice|setInterval|linear|display|none|easeOut|addEvent|config|direction|settings|xmlFile|onChange|num|100|mouseout|default|par|mouseoverTimer|click|showNum|trigger|defConfig|test|window|onloadWindow|hasClass|getChild|onload|readyState|count|done|arrSize|overflow|hidden|cssNumber|item|__focusConstr__|isOpacity|loading|addHtml|runIndex|easing|filter|loadingShow|time|alt|pause|__myFocusTimer__|alpha|origTime|txtHeight|thumbShowNum|hover|Date|firstChild|setOpacity|switch|400|slideBody|set|arguments|setAnimateStyle|initBaseCSS|eval|parseFloat|isNaN|loadPattern|getBoxReady|loadXML|class_|initCSS|getIMGReady|zoomIMG|getFilePath|script|js|slide|head|removeClass|timeout|indexOf|onreadystatechange|parseSelector|remove|1000|reg|tag_|getElementsByTagName|margin|position|relative|splice|parent|align|important|styleSheet|flag|XMLHttpRequest|appendXML|jQuery|blur|bindControl|ceil|floor|getComputedStyle|isRunning|exec|split|clearTimeout|alert|Error|Setting|right|offset|toUpperCase|mF_fancy|scrollTo|500|fadeIn|getElementById|replaceChild|addListNum|block|_|fadeOut|load|addListTxt|800|stop|addListThumb|swing|cos|PI|mf|easeIn|link|easeInOut|mF__ID__|javascript|rel|stylesheet|removeChild|play|repeat|instanceof|childNodes|nodeName|loaded|complete|myfocus|lastIndexOf|doScroll|callee|concat|eq|charAt|Image|fillOpacity|fontWeight|lineHeight|padding|border|list|parseInt|sort|widows|zIndex|font|12px|Verdana|zoom|background|fff|visibility|visible|styleFloat|_wrap|center|cssFloat|insertBefore|all|navigator|userAgent|Opera|attachEvent|addEventListener|on|event|while|cancelBubble|returnValue|stopPropagation|preventDefault|currentStyle|ActiveXObject|Microsoft|XMLDOM|open|GET|random|send|isStop|responseXML|documentElement|image|title|onfocus|orphans'.split('|'),0,{})) -------------------------------------------------------------------------------- /js/myfocus-2.0.4.full.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * myFocus JavaScript Library v2.0.4 3 | * https://github.com/koen301/myfocus 4 | * 5 | * Copyright 2012, Koen Lee 6 | * Released under the MIT license 7 | * 8 | * Date: 2012/10/28 9 | */ 10 | (function(){ 11 | //DOM基础操作函数 12 | var $id=function(id){ 13 | return typeof id==='string'?document.getElementById(id):id; 14 | }, 15 | $tag=function(tag,parentNode){ 16 | return ($id(parentNode)||document).getElementsByTagName(tag); 17 | }, 18 | $tag_=function(tag,parentNode){ 19 | return $getChild(tag,parentNode,'tag'); 20 | }, 21 | $class=function(className,parentNode){ 22 | var doms=$tag('*',parentNode),arr=[]; 23 | for(var i=0,l=doms.length;i'://children 113 | isChild=true; 114 | break; 115 | case '.'://class 116 | var cls=s.slice(1); 117 | var fn=isChild?$class_:$class; 118 | $(parent).each(function(){ 119 | dom=dom.concat(fn(cls,this)); 120 | }); 121 | isChild=false; 122 | break; 123 | case '#'://id 124 | var id=s.slice(1),e=$id(id); 125 | if(e) dom.push($id(id)); 126 | isChild=false; 127 | break; 128 | default://tag(支持'tag.class'寻找,不支持也不建议用'tag#id'寻找,请用'#id') 129 | var fn=isChild?$tag_:$tag,sArr=s.split('.'); 130 | var tag=sArr[0],cls=sArr[1]; 131 | $(parent).each(function(){ 132 | var arr=fn(tag,this); 133 | for(var i=0,len=arr.length;i+~,(\[\\]+)+|[>+~])(\s*,\s*)?/g; 165 | var parts=[],m; 166 | while((m = chunker.exec(selector)) !== null ) { 167 | parts.push( m[1] );//存储匹配的字符串信息 168 | } 169 | return parts; 170 | }, 171 | wrap:function(html){//每次只wrap一个元素,多个请用each 172 | var o=this[0],e=document.createElement('div'); 173 | e.innerHTML=html; 174 | var wrap=e.firstChild; 175 | o.parentNode.replaceChild(wrap,o); 176 | wrap.appendChild(o); 177 | return this; 178 | }, 179 | addHtml:function(html){ 180 | var parent=this[0]; 181 | var e=document.createElement('div'); 182 | e.innerHTML=html; 183 | var dom=e.childNodes[0]; 184 | parent.appendChild(dom); 185 | return myFocus(dom); 186 | }, 187 | addList:function(className,type){ 188 | var li=this.HTMLUList,n=this.HTMLUListLength; 189 | var strArr=['
      ']; 190 | for(var i=0;i';break;//b标签主要是为了做透明背景,下同 194 | case 'txt' :html=img?li[i].innerHTML.replace(/\/i,img.alt)+'

      '+img.getAttribute("text")+'

      ':'';break; 195 | case 'thumb':html=img?'':'';break; 196 | default :html=''; 197 | } 198 | strArr.push('
    • '+html+'
      • '); 199 | } 200 | strArr.push('
    '); 201 | return this.addHtml(strArr.join('')); 202 | }, 203 | addListNum:function(className){ 204 | return this.addList(className||'num','num');//默认class=num 205 | }, 206 | addListTxt:function(className){ 207 | return this.addList(className||'txt','txt');//默认class=txt 208 | }, 209 | addListThumb:function(className){ 210 | return this.addList(className||'thumb','thumb');//默认class=thumb 211 | }, 212 | remove:function(){ 213 | var o=this[0]; 214 | if(o) o.parentNode.removeChild(o); 215 | }, 216 | repeat:function(n){ 217 | var n=n||2,pNode=this[0].parentNode,html=pNode.innerHTML,s=[]; 218 | for(var i=0;i({height:'300px'}),可以不带单位px 235 | for(var p in css){ 236 | if(typeof css[p]==='number'&&!this.cssNumber[p]) css[p]+='px'; 237 | arr.push(p.replace(/([A-Z])/g,'-$1')+':'+css[p]+';'); 238 | if(p==='opacity') arr.push('filter:alpha(opacity='+css[p]*100+')'); 239 | } 240 | o.style.cssText+=arr.join(''); 241 | return this; 242 | } 243 | }, 244 | setOpacity:function(value){//仅用于animate要求高效的核心算法中,其它情况可用css()代替 245 | this[0].style.opacity=value,this[0].style.filter='alpha(opacity='+value*100+')'; 246 | }, 247 | setAnimateStyle:function(value,prop,m){//仅用于animate要求高效的核心算法中,其它情况可用css()代替 248 | this[0].style[prop]=Math[m](value)+'px'; 249 | }, 250 | addClass:function(className){ 251 | this[0].className+=' '+className; 252 | return this; 253 | }, 254 | removeClass:function(className){ 255 | var o=this[0],cls=className&&o.className,reg="/\\s*\\b"+className+"\\b/g"; 256 | o.className=cls?cls.replace(eval(reg),''):''; 257 | return this; 258 | }, 259 | cssNumber:{fillOpacity:true,fontWeight:true,lineHeight:true,opacity:true,orphans:true,widows:true,zIndex:true,zoom:true}//不加px的css,参考jQuery 260 | }); 261 | myFocus.fn.extend({//Animate 262 | animate:function(attr,value,time,type,funcBefore,funcAfter){//value支持相对增值'+=100',相对减值'-=100'形式 263 | var $o=this,o=$o[0],isOpacity=attr==='opacity',diffValue=false; 264 | funcBefore&&funcBefore.call(o); 265 | if(typeof value==='string'){ 266 | if(/^[+-]=\d+/.test(value)) value=value.replace('=',''),diffValue=true; 267 | value=parseFloat(value); 268 | } 269 | var oriVal=$o.css(attr),//原始属性值 270 | b=isNaN(oriVal)?0:oriVal,//开始值,无值时为0 271 | c=diffValue?value:value-b,//差值 272 | d=time,//总运行时间 273 | e=this.easing[type],//缓动类型 274 | m=c>0?'ceil':'floor',//取最大绝对值 275 | timerId='__myFocusTimer__'+attr,//计数器id 276 | setProperty=$o[isOpacity?'setOpacity':'setAnimateStyle'],//属性设置方法 277 | origTime=(new Date)*1;//原始时间值 278 | o[timerId]&&clearInterval(o[timerId]); 279 | o[timerId]=setInterval(function(){ 280 | var t=(new Date)-origTime;//已运行时间 281 | if(t<=d){ 282 | setProperty.call($o,e(t,b,c,d),attr,m); 283 | }else{ 284 | setProperty.call($o,b+c,attr,m);//设置最终值 285 | clearInterval(o[timerId]),o[timerId]=null; 286 | funcAfter&&funcAfter.call(o); 287 | } 288 | },13); 289 | return this; 290 | }, 291 | fadeIn:function(time,type,fn){ 292 | if(typeof time!=='number') fn=time,time=400;//默认400毫秒 293 | if(typeof type==='function') fn=type,type=''; 294 | this.animate('opacity',1,time,type||'linear',function(){ 295 | myFocus(this).css({display:'block',opacity:0}); 296 | },fn); 297 | return this; 298 | }, 299 | fadeOut:function(time,type,fn){ 300 | if(typeof time!=='number') fn=time,time=400;//默认400毫秒 301 | if(typeof type==='function') fn=type,type=''; 302 | this.animate('opacity',0,time,type||'linear',null,function(){ 303 | this.style.display='none'; 304 | fn&&fn.call(this); 305 | }); 306 | return this; 307 | }, 308 | slide:function(params,time,type,fn){ 309 | if(typeof time!=='number') fn=time,time=800;//默认800毫秒 310 | if(typeof type==='function') fn=type,type=''; 311 | for(var p in params) this.animate(p,params[p],time,type||'easeOut',null,fn); 312 | return this; 313 | }, 314 | stop:function(){//停止所有运动 315 | var o=this[0]; 316 | for(var p in o) if(p.indexOf('__myFocusTimer__')!==-1) o[p]&&clearInterval(o[p]); 317 | return this; 318 | }, 319 | easing:{ 320 | linear:function(t,b,c,d){return c*t/d + b;}, 321 | swing:function(t,b,c,d) {return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;}, 322 | easeIn:function(t,b,c,d){return c*(t/=d)*t*t*t + b;}, 323 | easeOut:function(t,b,c,d){return -c*((t=t/d-1)*t*t*t - 1) + b;}, 324 | easeInOut:function(t,b,c,d){return ((t/=d/2) < 1)?(c/2*t*t*t*t + b):(-c/2*((t-=2)*t*t*t - 2) + b);} 325 | } 326 | }); 327 | myFocus.fn.extend({//Method(fn) 328 | bind:function(type,fn){ 329 | myFocus.addEvent(this[0],type,fn); 330 | return this; 331 | }, 332 | play:function(funcLastFrame,funcCurrentFrame,seamless){ 333 | var this_=this,p=this_.settings,n=this_.HTMLUListLength,t=p.time*1000,seamless=seamless||false,//是否无缝 334 | float=myFocus(this_.HTMLUList).css('float'),isLevel=float==='left',//仅支持'left'方向和'top'方向 335 | direction=isLevel?'left':'top',distance=isLevel?p.width:p.height,//运动距离 336 | indexLast=0,indexCurrent=p.index;//帧索引值,默认0 337 | this_.find('.loading').remove();//删除loading... 338 | this_.run=function(value){//循环运动函数,支持+-=value 339 | funcLastFrame&&funcLastFrame(indexLast,n);//运行前一帧 340 | indexCurrent=typeof value==='string'?indexLast+parseInt(value.replace('=','')):value;//fixed index 341 | if(indexCurrent<=-1){//prev run 342 | indexCurrent=n-1;//转到最后一帧 343 | if(seamless) this_.HTMLUList[0].parentNode.style[direction]=-n*distance+'px';//无缝的UL定位 344 | } 345 | if(indexCurrent>=n){//next run 346 | if(!seamless) indexCurrent=0;//非无缝时转到第一帧 347 | if(indexCurrent>=2*n){//无缝 348 | this_.HTMLUList[0].parentNode.style[direction]=-(n-1)*distance+'px';//无缝的UL定位 349 | indexCurrent=n; 350 | } 351 | } 352 | if(seamless&&indexLast>=n&&indexCurrent1){//自动切换 361 | this_.runTimer=setInterval(function(){this_.run('+=1')},t);//默认递增运行每帧 362 | this_.bind('mouseover',function(){//绑定事件 363 | clearInterval(this_.runTimer); 364 | this_.runTimer='pause';//标记以防止执行两次this_.runTimer 365 | }).bind('mouseout',function(){ 366 | if(!this_.isStop&&this_.runTimer==='pause') this_.runTimer=setInterval(function(){this_.run('+=1')},t); 367 | }); 368 | } 369 | this_.find('a').each(function(){//去除IE链接虚线 370 | this.onfocus=function(){this.blur();} 371 | }); 372 | }, 373 | bindControl:function($btnList,params){//params={thumbShowNum(略缩图显示数目(如果有)):num,isRunning(运行中的标记(当需要判断时)):boolean} 374 | var this_=this,p=this_.settings,type=p.trigger,delay=p.delay,par=params||{},tsNum=par.thumbShowNum||p.thumbShowNum; 375 | var run=function(){ 376 | if(this.index!==this_.runIndex&&!par.isRunning){ 377 | this_.run(this.index); 378 | return false;//阻止冒泡&默认事件 379 | } 380 | }; 381 | $btnList.each(function(i){ 382 | this.index=i;//记录自身索引 383 | var o=this,$o=myFocus(o); 384 | if(type==='click'){ 385 | $o.bind('mouseover',function(){ 386 | $o.addClass('hover'); 387 | }).bind('mouseout',function(){ 388 | $o.removeClass('hover'); 389 | }).bind('click',run); 390 | }else if(type==='mouseover'){ 391 | $o.bind('mouseover',function(){ 392 | if(delay===0) run.call(o); 393 | else $btnList.mouseoverTimer=setTimeout(function(){run.call(o)},delay); 394 | }).bind('mouseout',function(){ 395 | $btnList.mouseoverTimer&&clearTimeout($btnList.mouseoverTimer); 396 | }); 397 | }else{ 398 | alert('myFocus Error Setting(trigger) : \"'+type+'\"'); 399 | return false; 400 | }; 401 | }); 402 | if(tsNum){//thumb 403 | var float=$btnList.css('float'),isLevel=float==='left'||float==='right'; 404 | $btnList.dir=isLevel?'left':'top';//方向 405 | $btnList.n=this_.HTMLUListLength;//总数 406 | $btnList.showNum=tsNum;//显示数目 407 | $btnList.showStart=p.index;//显示的开始索引 408 | $btnList.showEnd=$btnList.showStart+tsNum-1;//显示的结尾索引 409 | $btnList.distance=$btnList.css(isLevel?'width':'height');//运动距离 410 | $btnList.slideBody=$btnList.parent();//运动对象(ul) 411 | } 412 | }, 413 | scrollTo:function(i,time){ 414 | var n=this.n,dir=this.dir,$ul=this.slideBody,css={};//总数/方向/滑动body(ul)/样式 415 | if(i>=this.showEnd){//next 416 | this.showEnd=i0?i-1:0; 421 | this.showEnd=this.showStart+this.showNum-1; 422 | } 423 | css[dir]=-this.showStart*this.distance; 424 | $ul.slide(css,time||500,'easeOut'); 425 | return this; 426 | } 427 | }); 428 | myFocus.extend({//Init 429 | set:function(p,callback){ 430 | var F=this,id=p.id,oStyle=F.initBaseCSS(id); 431 | p.pattern=p.pattern||F.defConfig.pattern; 432 | p.__clsName=p.pattern+'_'+id; 433 | F.addEvent(window,'load',function(){F.onloadWindow=true}); 434 | F.loadPattern(p,function(){ 435 | p=F.extend({},F.defConfig,F.config[p.pattern],p);//收集完整参数 436 | F.getBoxReady(p,function(){ 437 | var $o=F($id(id)); 438 | p.$o=$o;//保存node 439 | //xml load 440 | p.xmlFile&&F.loadXML(p); 441 | p.pic=$class('pic',$o[0])[0];//保存node for是否标准风格的判断及是否需要initcss 442 | p.width=p.width||$o.css('width'),p.height=p.height||$o.css('height');//获得box高/宽 443 | F.initCSS(p,oStyle);//css 444 | $o.addClass(p.pattern+' '+p.__clsName);//+className 445 | F.getIMGReady(p,function(arrSize){ 446 | if(p.autoZoom) F.zoomIMG(p,arrSize);//缩放图片 447 | F.pattern[p.pattern](p,F);//运行pattern代码 448 | callback&&callback(); 449 | }); 450 | }); 451 | }); 452 | }, 453 | onloadWindow:false, 454 | loadPattern:function(p,callback){ 455 | if(this.pattern[p.pattern]){callback();return;}//如果已加载pattern 456 | var path=this.getFilePath()+'mf-pattern/'+p.pattern; 457 | var js= document.createElement("script"),css=document.createElement("link"),src=path+'.js',href=path+'.css'; 458 | js.type = "text/javascript",js.src=src; 459 | css.rel = "stylesheet",css.href=href; 460 | var head=$tag('head')[0],isSuccess=false,timeout=10*1000;//超时10秒 461 | head.appendChild(css); 462 | head.appendChild(js); 463 | js.onload=js.onreadystatechange=function(){ 464 | if(isSuccess) return;//防止IE9+重复执行 465 | if(!js.readyState||js.readyState=="loaded"||js.readyState=="complete"){ 466 | isSuccess=true; 467 | callback(); 468 | js.onload=js.onreadystatechange=null; 469 | } 470 | }; 471 | setTimeout(function(){if(!isSuccess) $id(p.id).innerHTML='加载失败: '+src;},timeout); 472 | }, 473 | getFilePath:function(){ 474 | var path=''; 475 | var scripts=$tag("script"); 476 | for(var i=0,len=scripts.length;i= boxWidth / boxHeight){ 521 | var width=boxWidth,height=boxWidth/w*h,top=(boxHeight-height)/2; 522 | }else{ 523 | var width=boxHeight/h*w,height=boxHeight,top=0; 524 | } 525 | imgs[i].style.cssText=';width:'+width+'px;height:'+height+'px;margin-top:'+top+'px;'; 526 | }; 527 | }, 528 | initCSS:function(p,oStyle){ 529 | var css=[],w=p.width||'',h=p.height||''; 530 | if(p.pic){ 531 | css.push('.'+p.__clsName+' *{margin:0;padding:0;border:0;list-style:none;}.'+p.__clsName+'{position:relative;width:'+w+'px;height:'+h+'px;overflow:hidden;font:12px/1.5 Verdana;text-align:left;background:#fff;visibility:visible!important;}.'+p.__clsName+' .pic{position:relative;width:'+w+'px;height:'+h+'px;overflow:hidden;}.'+p.__clsName+' .txt li{width:'+w+'px;height:'+p.txtHeight+'px!important;overflow:hidden;}'); 532 | if(p.wrap) p.$o.wrap('
    '); 533 | if(p.autoZoom) css.push('.'+p.__clsName+' .pic li{text-align:center;width:'+w+'px;height:'+h+'px;}');//缩放图片居中 534 | } 535 | try{oStyle.styleSheet.cssText=css.join('')}catch(e){oStyle.innerHTML=css.join('')} 536 | }, 537 | initBaseCSS:function(id){ 538 | var s='#'+id+' *{display:none}',oStyle=document.createElement('style'); 539 | oStyle.type='text/css'; 540 | try{oStyle.styleSheet.cssText=s}catch(e){oStyle.innerHTML=s} 541 | var oHead = $tag('head',document)[0]; 542 | oHead.insertBefore(oStyle,oHead.firstChild); 543 | return oStyle; 544 | } 545 | }); 546 | myFocus.extend({//Method(myFocus) 547 | isIE:!!(document.all&&navigator.userAgent.indexOf('Opera')===-1),//!(+[1,]) BUG IN IE9+ 548 | addEvent:function(o,type,fn){ 549 | var ie=this.isIE,e=ie?'attachEvent':'addEventListener',t=(ie?'on':'')+type; 550 | o[e](t,function(e){ 551 | var e=e||window.event,flag=fn.call(o,e); 552 | if(flag===false){ 553 | if(ie) e.cancelBubble=true,e.returnValue=false; 554 | else e.stopPropagation(),e.preventDefault(); 555 | } 556 | },false); 557 | }, 558 | loadXML:function(p){ 559 | var xmlhttp = window.XMLHttpRequest?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLDOM"); 560 | xmlhttp.open("GET", p.xmlFile + "?" + Math.random(), false); 561 | xmlhttp.send(null); 562 | this.appendXML(xmlhttp.responseXML,p); 563 | }, 564 | appendXML:function(xml,p){ 565 | var items=xml.documentElement.getElementsByTagName("item"),len=items.length; 566 | var html=['
      ']; 567 | for(var i=0;i'+items[i].getAttribute('title')+''); 569 | } 570 | html.push('
    '); 571 | p.$o[0].innerHTML=html.join(''); 572 | } 573 | }); 574 | //支持JQ 575 | if(typeof jQuery!=='undefined'){ 576 | jQuery.fn.extend({ 577 | myFocus:function(p,fn){ 578 | if(!p) p={}; 579 | p.id=this[0].id; 580 | if(!p.id) p.id=this[0].id='mF__ID__'; 581 | myFocus.set(p,fn); 582 | } 583 | }); 584 | } 585 | })(); --------------------------------------------------------------------------------