我的磨皮肤设置代码参考 - 心录历程(心程网)

此代码仅供参考

代码说明

添加说明文字

CSS代码

@charset "utf-8";
/**
 * CSS Global Style
 * @author: Cosplay;
 * @data: 2014-11-29;
 * @个人专用.请勿复制.谢谢
**/

* { margin: 0px;}
img { max-width: 98%;}
li { list-style-type: none;}
body{ font-family: '微软雅黑'; color: #563743; background: #F5F6F8; text-align: center; margin: 0 auto; background-image:url(http://qdbj.tk/entry/319671/fd5a9bc25573f16803ce9a0819705804/bg.png); padding: 0px;}
hr { border: 1px solid #D5B681; max-width: 94%; margin: 8px auto;}
a,a:link,a:visited,a:hover,a:active{ text-decoration: none; color: #563743;}

a[href*="/cat/"],#ln-h { display: none;}

#nav { width: 100%; box-shadow: 0px 0px 8px #999;  background-position: center top; height: 118px;   max-height: 120px; background-image:url(http://qdbj.tk/entry/319671/20141213/dd0a7a729ad8dd0118827043f3b20046/sonico.jpg); overflow: hidden;}

#nav a { width: 24.9%; padding: 10px 0px; display: inline-block; float:left;}

@media only screen and (max-device-width: 239px){ body{font-size: 13px;} }

@media only screen and (min-device-width: 240px) and (max-width: 481px){ body{font-size: 14px;} #nav {  background-size: 110% auto; -webkit-background-size: 110% auto; -moz-background-size: 110% auto; -ms-background-size: 110% auto; -o-background-size: 110% auto; background-position:  0px 0px;} }

@media only screen and (min-device-width: 482px){ body{font-size: 15px;} #nav { background-size: 110% auto; -webkit-background-size: 110% auto; -moz-background-size: 110% auto; -ms-background-size: 110% auto; -o-background-size: 110% auto; background-position: 0px 0px;} }

@media only screen and (min-device-width: 680px){ body{font-size: 15px;} #nav {
 background-size: 110% auto; -webkit-background-size: 110% auto; -moz-background-size: 110% auto; -ms-background-size: 110% auto; -o-background-size: 110% auto; background-position: 20px 0px;} }

@media only screen and (min-device-width: 880px){ body{font-size: 15px;} #nav { background-size: 61% auto; -webkit-background-size: 61% auto; -moz-background-size: 61% auto; -ms-background-size: 61% auto; -o-background-size: 61% auto; background-position: 241px -45px;} }

@media only screen and (min-width: 1024px) { body{font-size:  16px;} #nav { background-size: 75% auto; -webkit-background-size: 62% auto; -moz-background-size: 62% auto; -ms-background-size: 62% auto; -o-background-size: 62% auto;} }

@media only screen and (min-width: 1250px) { body{font-size:  16px;} #nav { background-size: 75% auto; -webkit-background-size: 62% auto; -moz-background-size: 62% auto; -ms-background-size: 62% auto; -o-background-size: 62% auto; background-position: 342px 586px !important;} }

#whole_body { height: auto;}

#top{ position: fixed; top: 0; right: 0; left: 0; z-index: 500; height: 44px; box-sizing: border-box; background: #ffc300; text-align: center; border-bottom: 1px solid #dda900;}

.pagination {height: 50px; line-height: 50px; background: #fbf8f1; display: block; color:#563743; clear:both;}

.pagination a { padding: 0px 10px; transition: 1s; height: 50px; line-height: 50px; display: inline-block;}
.pagination a:hover { background: #0BACD3; border-radius: 5px;  box-shadow: 2px 2px 6px #C2B196; color: #FFF;}

.pagination .page_no_link { padding: 0px 10px; transition: 1s; height: 50px; line-height: 50px; display: inline-block;}

.pagination .page_no_link:hover { background: #0BACD3; border-radius: 5px;  box-shadow: 2px 2px 6px #C2B196; color: #FFF;}

.loading { width: 124px; height:41px; line-height: 41px; text-align:center; position: fixed; left: 50%; top: 50%; z-index: 3; background: #FFF; border: 1px solid #ccc; border-radius: 10px; margin-left: -62px; margin-top: -20px; box-shadow: 1px 0px 9px #D4C3AA;}

.cosplay_tx { width: 35px;  display: block; margin-left: 6px; margin-top: 5px; float: left;}

.cosplay_tx:hover { opacity: 0.85;}

.menu { width: 20px;  height: 18px; display: inline-block; background-image: url(http://qdbj.tk/entry/319671/ecaa8a9c40d515117197c0abe28543aa/pic.png); background-size: 234px 48px; background-repeat: no-repeat; background-position: -136px 0; margin-top: 13px;  cursor: pointer; position: fixed; right: 10px; top: 0px; }

.webname { width: 165px; text-align: center; display: inline-block; font-size: 20px; color: #FFF; margin-left: -82px; text-align: center; line-height: 42px; position: fixed; left: 50%; top: 0px;}

.file_list { margin-top: 1px;}

.file_list li { height: 38px; background: #FFF; text-align: left; margin: 0px; border-bottom: 1px solid #EEE; padding: 6px; background-size: 40px 44px; -webkit-background-size: 40px 44px; -moz-background-size: 40px 44px; -ms-background-size: 40px 44px; -o-background-size: 40px 44px; background-repeat: no-repeat; background-position: 10px center; clear: both; position: relative; transition: 0.6s;}

.file_list li a { width: 80%; height: 25px; overflow: hidden; display: block; float: left; line-height: 26px; padding-left: 55px; transition:color 0.3s;}

.file_list li span { float: right; display: block; clear:both; font-size: 12px;}

.file_list li .edit { position: absolute; top: 0px; right: 0px; width: auto; font-size: 12px;}

.file_list li:hover { background: #eee; background-size: 40px 44px; background-repeat: no-repeat; background-position: 10px center;}

.file_list li:hover a { color: #009B9B; }

.wo-search-form,.wo-search-home { display:none}
/* 公告 */
.bulletin { font-size: 13px; padding: 10px 20px; background: #ffedc7; color: #6b3612; border-radius: 3px; margin-top: 1px; padding-top: 12px;}

.tb_gg { width: 17px; height: 19px; float: left; background:url(http://qdbj.tk/entry/319671/d34659af17d4fe1ea94ba59f6a17306c/bulletin.jpg) no-repeat; background-size: 100%; margin-right: 5px; background-position: center right;}

.gonggao { float: left; font-style: initial; font-size: 14px;}

#scrollDiv{ overflow:auto}

.scrollText{width: auto;height:20px; float:left;overflow:hidden; text-align: left; margin-top: 1px;}

.scrollText ul { height: 20px;}

.scrollText li{ height:25px;}

.scrollText ul,li { padding:0px; margin:0px;}

.up{ margin-left:310px; width:50px; height:50px; background:#F90}

.down{ margin:0 0 0 310px; zoom:1; width:50px; height:50px; background:#960}
/* 公告 end */

/* 搜索 */
.search {  height: 34px; background: #FFEDC7; border-top: 1px solid #FFD477; padding: 5px; text-align: right; position: relative;}

.sel_sc { display: block; border: 5px solid #868686; position: absolute; border-color: #868686 transparent transparent; top: 19px; left: 44px; z-index: 3;}

.selarch_box { width: 100%; position: absolute; top: 0px; left: 0px; overflow: hidden;}

.search .search_sel { width: 59px ;height: 32px; padding-left: 3px; background: #FBF8F1; border-radius: 5px 0px 0px 5px; border: 1px solid #FFD477; position: absolute; top: 6px; left: 2px; appearance: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; -webkit-border-image: none; -webkit-box-shadow: none;}

.search .search_test { width: 99%; height: 28px; font-size: 13px; color: #666; border: 1px solid #FFD477; border-radius: 5px; background: #FBF8F1; margin-top: 6px; padding-left: 60px;}

.search .search_btn { width: 37px; height: 31px; position: absolute; top: 7px; right: 0; border: none; border-left: 1px solid #FFD477; background: none; background-image: url(http://qdbj.tk/entry/319671/ecaa8a9c40d515117197c0abe28543aa/pic.png); background-position: -511px 31px; background-size: 384px auto; -webkit-background-size: 384px auto; -moz-background-size: 384px auto; -ms-background-size: 384px auto; -o-background-size: 384px auto;}

/* 搜索 end*/

.back_top { width: 30px; height: 30px; line-height: 30px; font-size: 12px; font-weight: bold; display: inline-block; position: fixed; z-index: 200; bottom: 5%; right: 2%; padding: 3px; background: #dddec2; color: #696b53; border-radius: 30px; -moz-transition: all 0.26s ease-out 0s; -webkit-transition: all 0.26s ease-out 0s; opacity: .75;}

.back_top:hover { background: #c8c9a7; color: #f2f5cd;}

html {cursor: url(/entry/319671/7a828e2626d8189934eb26f5d39c0dc0/mouse_out.cur), url(http://qdbj.tk/entry/319671/7a828e2626d8189934eb26f5d39c0dc0/mouse_out.cur), auto;}

a,.menu {cursor: url(/entry/319671/332b9e8d27657d2ae508888ce65a90ae/mouse_over.cur), url(http://qdbj.tk/entry/319671/332b9e8d27657d2ae508888ce65a90ae/mouse_over.cur), auto;}

/* 菜单 */
#menu_mask { width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; z-index: -1; display: none;}

.menu_cont { margin: 0; top: 30px; left: auto; right: 3px; }

.menu_cont  ul { color: #8f8f95; padding: 0px;}

.menu_cont li { text-indent: 32px; min-width: 110px; height: 24px; line-height: 27px;}

.popup { position: absolute; margin-top: 18px; right: 4px; z-index: 1;}

.popup ul { font-size: 15px; color: #000; background: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 1px 1px 10px silver; -moz-box-shadow: 1px 1px 10px silver; box-shadow: 1px 1px 10px silver;}

.popup li { padding: 10px; border-bottom: 1px solid #efefef;}

.popup ul::before { content: ''; border: 10px solid transparent; border-bottom: 10px solid #fff; width: 0; height: 0; position: absolute; top: -19px; right: 10px;}

.menu-popup-favo::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/ecaa8a9c40d515117197c0abe28543aa/pic.png); background-size: 234px 48px; background-repeat: no-repeat; background-position: -156px 0;}

.menu-popup-item_Icon::before { content: ''; display: block; position: absolute; top: 10px; left: 10px;}

.menu-popup-b2t::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/ecaa8a9c40d515117197c0abe28543aa/pic.png); background-size: 234px 48px; background-repeat: no-repeat; background-position: -208px 0;}

.hover {position: relative;}

.menu-popup-feed::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/ecaa8a9c40d515117197c0abe28543aa/pic.png); background-size: 234px 48px; background-repeat: no-repeat; background-position: -182px 0;}

.menu_icon_upload::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/b5b9e9c9f67babc441ed6ffff6e392a2/icon_cloud-upload.png); background-size: 26px 24px; background-repeat: no-repeat; background-position: 0px 0px;}

.menu_icon_manage::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/dbf1229d6c597048b32675be6b80f60d/icon_folder-open_alt.png); background-size: 26px 24px; background-repeat: no-repeat; background-position: 0px 0px;}

.menu_icon_settings::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/9fbd8e04232b80614656aa0172a1ed70/settings.png); background-size: 26px 24px; background-repeat: no-repeat; background-position: 0px 0px;}

.menu_icon_link::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/a3713c4fd97f2ebb9e62481f10b32499/icon_tag_link.png); background-size: 26px 24px; background-repeat: no-repeat; background-position: 0px 0px;}

.menu_icon_about::before { width: 26px; height: 24px; background-image: url(http://qdbj.tk/entry/319671/a83bddb658691918952cff13b86fced3/menu_icon_about.png); background-size: 26px 24px; background-repeat: no-repeat; background-position: 0px 0px;}
/* 菜单 end*/

.wo-mode-visitor .wo-search-home { display: none !important;}

#copyright { font-size: 14px; padding: 12px 5px; background: #333; color: #FFF; border-top: 2px solid #288198; margin-top: 15px;}

#copyright span { color:#019C98;}

#cnzz_stat_icon_1253683238 { padding-left: 5px;}

/* 本站小助手 小C */
.spig { display: block; width: 140px; height: 140px; position: absolute; top: -200px; left: 160px; z-index: 9999; font-size: 12px;}

#message{ color :#191919;border: 1px solid #c4c4c4;background:#ddd;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;min-height:1em;padding:5px;top:-30px;position:absolute;text-align:center;width:auto !important;z-index:10000;-moz-box-shadow:0 0 15px #eeeeee;-webkit-box-shadow:0 0 15px #eeeeee;border-color:#eeeeee;box-shadow:0 0 15px #eeeeee;outline:none;}

.mumu{ width: 140px; height: 140px; cursor: move; background-image: url(http://qdbj.tk/entry/319671/20141213/485054448e4c50cbbbb836369d87ad42/spin.png); background-repeat: no-repeat; background-size: 76%;}

#Main{ width:940px; height:auto; overflow:hidden; margin:0 auto; background:#fff; border:1px #ccc solid; margin-top:6px; padding:20px;}

.bock-tit h3{ font-size:16px; line-height:30px;}

.arlist{ border-bottom:1px #ccc solid; padding:10px; line-height:20px; text-indent:2em;}

.arlist span{ margin-left:15px;}
/* 本站小助手 end */

/* 内页 */
.wo-file-main { width: 92%; margin: 0 auto; background: #FFF; border-radius: 5px; padding: 10px; word-wrap:break-word; margin-bottom: 20px;}

.wo-file-main a { padding: 4px 14px; background: #F4AD49; border: none; border-radius: 5px; color: #FFF; font-size: 1em; cursor: pointer; display: inline-block; margin-top: 5px;}

.wo-file-main p { padding: 5px; border-bottom: 1px solid #F1F1F1;}

.wo-file-title { font-size: 1em; background: #DDD; padding: 10px; border-radius: 5px 5px 0px 0px;}

body:before{ content: "Cosplay-前端笔记"; display: block; height: 43px; line-height: 43px; font-size: 20px; text-align: center; background: #ffc300; border-bottom: 1px solid #dda900; color: #fff; overflow: hidden;}

.wo-entry-title,.wo-entry-time,.wo-entry-section { text-align: left; background: #FFF; margin: 0px 5px; padding: 5px 10px;}

.wo-entry-title {font-size: 20px; color: #FFC300; border: none; border-radius: 5px 5px 0px 0px; margin-bottom: 0px; padding-top: 10px;}

.wo-entry-time { font-size: 14px; color: #ccc; border-bottom: 1px solid #F4F4F4; padding-top: 10px;}

.content { font-size: 14px; color: #333;}

.content h1 { font-size: 16px; color: #00B7E9; padding: 8px 0px; border-bottom: 1px solid #EAEAEA;}

.content p { padding: 8px 0px;}

.content pre { padding: 10px; background: #F1F1F1;  color: #666; line-height: 22px; word-wrap:break-word;}

.red { color: red;}

.blue { color: #0085FF; border-bottom: 1px dashed #666;}

.end { padding-top: 15px; border-bottom: 1px solid #eee; color: #333;}

#whole_body { margin-top: 10px;}

form[action^="http://s.wodemo."] { background: #FBF8F1; width: 93%; margin: 0 auto; padding: 10px; margin-top: 20px; border-radius: 5px; line-height: 28px;}

form[action^="http://s.wodemo."] textarea { width: 90%; height: 81px; border-radius: 5px; border: 1px solid #DAD1CE;  -webkit-box-shadow: inset 0 1px 6px #E6DBC0;}

form[action^="http://s.wodemo."] input[type=submit] { padding: 9px 105px; background: #F4AD49; border: none; border-radius: 5px; color: #FFF; font-size: 1em; font-weight: bold; border-bottom: 1px solid #C38A3A; cursor: pointer;}

form[action^="http://s.wodemo."] input[type=submit]:hover { opacity: 0.9;}

.wo-file-description-contents { line-height: 25px; font-size: 0.9em; display: inline-block; text-align: left; vertical-align: text-top;}

.wo-file-screenshot { background: #F1F1F1; text-align: center; padding-top: 14px; font-size: 1em; color: #B07A40; font-weight: bold;}

.wo-file-screenshot img { border: 4px solid #FFF; border-radius: 5px;}

.wo-file-description-area { margin: 5px 0px;}

embed { width: 100%; height: 500px;}

.xiaz { background: #F1F1F1; padding: 5px 0px;}

.xiaz p { padding: 6px; border-bottom: 1px dashed #DDD;}

.xiaz p:last-child { border: none;}

.xiaz p a { color: blue;}

.wo-entry-section a { color: #2F7F91;}

/* 新菜单栏 */
html { position: relative;}
.munu_zg { width: 100%; height: 100%; background: #000; opacity: 0.75; position: fixed; top: 0px; left: 0px; z-index: 99;}
.munu_right { width: 90%; height: 100%; color: #F5F5F5; position: fixed; top: 44px; right: 0px; z-index: 99999; text-align: left; background: #131515;}
.munu_right .ul_box { width: 100%; height: 100%; overflow: scroll; padding-left: 0px;}
.munu_right .ul_box li { background: #25292B; line-height: 50px; font-size: 1.1em; margin-bottom: 1px;}
.munu_right .ul_box li  .ul_box_title { padding-left: 18px; display: block; height: 50px; }

.munu_right .ul_sub li { background: #1C1F20; margin-bottom: 1px; transition: 0.5s;}
.munu_right .ul_sub li a { padding-left: 40px; color: #F5F5F5; font-size: 0.8em; height: 50px; display: block;}
.munu_right .ul_sub { padding-left: 0px; background: #25292B; display: none;}
.munu_right .ul_sub li:hover { background: #131515;}

HTML代码

<meta name="baidu-site-verification" content="3G7PjNLEpD" />
<meta name="author" content="Cosplay">
<meta name="copyright" content="Copyright © 2014-2015 Cosplay-前端笔记">
<meta name="description" content="Cosplay-前端笔记 (Cosplay.wodemo.com | qdbj.tk) 记录总结各种经验和技巧，收集与整理各类常用代码、工具、教程，方便前端开发。">
<meta name="keywords" content="cosplay,站点,wodemo,前端笔记,我的磨">

<div class="bulletin">
    <div class="tb_gg"></div>
    <i class="gonggao">公告：</i>
    
<script src="/down/319514/jquery.js"></script>
<div id="scrollDiv">
<div class="scrollText">
  <ul style="margin-top: 0px; ">
      <li>还没加载完? 刷新下试试看吧.</li>
      <li>12.4 修复了浏览器兼容问题.</li>
      <li>生活很多时候总是不如意.</li>
  </ul>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
    $("#scrollDiv").textSlider({line:1,speed:500,timer:3000});
});
</script>

</div>

<div class="search">
 <div class="selarch_box">
  <form action="/search">
  <input type="text" name="q" class="search_test" maxlength="28" value="请输入你想搜索的关键词吧..." onfocus="if(this.value == '请输入你想搜索的关键词吧...'){this.value = ''}" onblur="if(this.value == ''){ this.value = '请输入你想搜索的关键词吧...'}">
  <span class="sel_sc"></span>
  <select name="all" class="search_sel">
    <option value="0">本站</option>
    <option value="1">全站</option>
  </select>
  <input type="submit" class="search_btn" value=" ">
  </form>
 </div>
</div>

<script src="http://qdbj.tk/entry/319671/dfc9182d663dc4d8dc390d714843cf25/xren.js"></script>
<script type="text/javascript">

var isindex = true;
var visitor = "";
</script>
<div id="spig" class="spig">
    <div id="message">正在加载中……</div>
    <div id="mumu" class="mumu"></div>
</div>

<div class="munu_zg" style="display: none"></div>
<div class="munu_right" style="width: 0px">
<ul class="ul_box">
	<li>
		<span class="ul_box_title">互动</span>
		<ul class="ul_sub" style="display:block">
			<li><a href="javascript:alert('留言板还在制作中哦～')">在线留言</a></li>
			<li><a href="http://qdbj.tk/entry/322222">友情链接</a></li>
			<li><a href="http://qdbj.tk/entry/319990">关于我们</a></li>
		</ul>
	</li>

<li>
		<span class="ul_box_title">WEB</span>
		<ul class="ul_sub">
			<li><a href="javascript:void(0)" onclick="location.href='/cat/245632'">CSS3</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/276463'">HTML5</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/276464'">Jquery</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/276465'">PHP</a></li>
                        <li><a href="javascript:void(0)" onclick="location.href='/cat/276466'">MySQL</a></li>
		</ul>
	</li>

JavaScript代码

/**
 * JavaScript Global Style
 * @author: Cosplay;
 * @data: 2014-11-29;
 * @个人专用.请勿复制.谢谢
**/

//配合导航布局
$("a[href*='/cat/']").appendTo("#nav");

//菜单栏里的管理链接
$('a').each(function(){
   if($(this).text() == "前往我的站点"){
     var username = $(this).attr('href').replace("http://","").replace(".wodemo.com/",""); 
     $('.gl').attr("href","http://s.wodemo.com/site/"+username);
   }else if($(this).text() == "进入管理模式"){
     $('.gl').attr("href","http://s.wodemo.com/site/cosplay");
   }
});

//加载完毕
window.onload=function(){
  $('.loading').remove();
}

//自动识别空文件类型
$('.file_list li').each(function(){
    if($(this).children('span').length == 0){
        $(this).find('a').after('<span>撰文</span>');
    }
});

//自动增加省略符
$('.file_list li a').each(function(){
    if($(this).text().length > 18){
    var textval = $(this).text();
    $(this).text( textval.substring(0 , 18) ).append(' ... ');
    }
});

//自动修改后缀
$('.file_list li span').each(function(){

$(this).text($(this).text().toUpperCase().replace("(","").replace(")",""));

if($(this).text() == 'JPG' ){        
        $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/287edf050d4e520796e8f714055cb31f/jpg.png)');
    }else if($(this).text() == 'PNG' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/bdda6250f0cfc37a453d50f3d0bf49b6/png.png)');
    }else if($(this).text() == 'GIF' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/6fa6173a47e646fff08d4c2ae267f3e5/gif.png)');
    }else if($(this).text() == 'JPEG' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/ea1089debb7c33101968fe0c37e495c5/jpeg.png)');
    }else if($(this).text() == 'MP3' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/a3f1cc50c5f491fc908eefc51dc5deca/mp3.png)');
    }else if($(this).text() == 'MP4' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/615803ee835a06bd243b5f05d4c25bc4/mp4.png)');
    }else if($(this).text() == 'MKV' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/94578550e996cac91da6f15ec291738c/mkv.png)');
    }else if($(this).text() == 'EXE' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/7a2de17f81a81988b94d55e418f16a38/exe.png)');
    }else if($(this).text() == 'DOC' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/02fd1b409be015ca5eef32c3a538b8a0/doc.png)');
    }else if($(this).text() == 'TXT' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/815b20ffe4176a73bfdba33f9ddf6eee/txt.png)');
    }else if($(this).text() == 'XLS' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/40bb4d7120f505385c02a3796d9e039d/xls.png)');
    }else if($(this).text() == 'SWF' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/3e0327bf8bbc8c7033cbb1fe15095d86/swf.png)');
    }else if($(this).text() == 'PPT' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/f231bad38eaa1515683ae4ca1029288b/ppt.png)');
    }else if($(this).text() == 'PDF' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/77e865cf31fc2c69afc8b49c88fb4712/pdf.png)');
    }else if($(this).text() == 'HTML' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/53cf03a69bf2a0e45ff84d80b2b32a29/html.png)');
    }else if($(this).text() == 'CSS' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/394856bab0f0a099d2807a1a5ee27b34/css.png)');
    }else if($(this).text() == 'JS' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/63a1262946ef80e318e78615adc319b5/jquery_js.png)');
    }else if($(this).text() == 'PHP'){
    }else if($(this).text() == 'PSD' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/c3851e42c6a6f6d0ebdd154704465834/psd.png)');
    }else if($(this).text() == 'FLV' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/1552dd805b92604b9ea5d279b8cd0bcb/flv.png)');
    }else if($(this).text() == 'AI' ){
    }else if($(this).text() == 'CDR' ){
    }else if($(this).text() == 'CHM' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/4b6dd7ce255b7e41c4a247a4167cfb2e/chm.png)');
    }else if($(this).text() == 'BMP' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/dc903ba3eb75b49f31fd9fcc11bcd066/bmp.png)');
    }else if($(this).text() == 'AVI' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/0c6467d961b01d2e6cf8e841ed1af25e/avi.png)');
    }else if($(this).text() == 'RAR' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/5b455ec01cfe53ac397f484ce89e977e/rar.png)');
    }else if($(this).text() == 'ZIP' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/49b9ca32fd6c84c50770d619babc8c58/zip.png)');
    }else if($(this).text() == 'APK' ){
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/ab2a02797e1181769b6c45a2dd544b4c/android.png)');
    }else{
       $(this).parent('li').css('background-image','url(http://qdbj.tk/entry/319342/5ec0abf4459f5ce71364280ba49d6259/zw.png)');

}
});

//编辑文件列表
$('.file_list li a').each(function(){
   if($(this).text()=='编辑'){
     $(this).addClass('edit');
     $(this).next('span').remove();
   }
});

//正则匹配
var filter=document.getElementById("whole_body");
filter.innerHTML=filter.innerHTML.replace(/\<span\sid\=\"ln\-h\"\>.+\n.+/,"");

/* 公告 */
(function($){
	$.fn.textSlider = function(settings){    
        settings = jQuery.extend({
        	speed : "normal",
			line : 2,
			timer : 1000
    	}, settings);
		return this.each(function() {
			$.fn.textSlider.scllor( $( this ), settings );
    	});
    }; 
	$.fn.textSlider.scllor = function($this, settings){
		//alert($this.html());
		var ul = $( "ul:eq(0)", $this );
		var timerID;
		var li = ul.children();
		var _btnUp=$(".up:eq(0)", $this)
		var _btnDown=$(".down:eq(0)", $this)
		var liHight=$(li[0]).height();
		var upHeight=0-settings.line*liHight;//滚动的高度；
		var scrollUp=function(){
			_btnUp.unbind("click",scrollUp);
			ul.animate({marginTop:upHeight},settings.speed,function(){
				for(i=0;i<settings.line;i++){
                	 //$(li[i]).appendTo(ul);
					 ul.find("li:first").appendTo(ul);
					// alert(ul.html());
                }
               	ul.css({marginTop:0});
                _btnUp.bind("click",scrollUp); //Shawphy:绑定向上按钮的点击事件
			});	
		};
		var scrollDown=function(){
			_btnDown.unbind("click",scrollDown);
			ul.css({marginTop:upHeight});
			for(i=0;i<settings.line;i++){
				ul.find("li:last").prependTo(ul);
            }
			ul.animate({marginTop:0},settings.speed,function(){
                _btnDown.bind("click",scrollDown); //Shawphy:绑定向上按钮的点击事件
			});	
		};
		var autoPlay=function(){
			timerID = window.setInterval(scrollUp,settings.timer);
			//alert(settings.timer);
		};
		var autoStop = function(){
            window.clearInterval(timerID);
        };
		//事件绑定
		ul.hover(autoStop,autoPlay).mouseout();
		_btnUp.css("cursor","pointer").click( scrollUp );
		_btnUp.hover(autoStop,autoPlay);
		_btnDown.css("cursor","pointer").click( scrollDown );
		_btnDown.hover(autoStop,autoPlay)
	};
})(jQuery);

/* 公告 end */

//返回顶部
$(window).scroll(function(){
  if($(document).scrollTop() + $(window).height() >= $(document).height()){
     $('.back_top').fadeIn();
  }else{
     $('.back_top').fadeOut();
  }

});

$('.back_top').click(function(){
    $('body,html').animate({scrollTop : 0},400);
});

//菜单栏
/*$('.menu').click(function(){
    $('#menu_cont,#menu_mask').fadeToggle();
});

$('#menu_mask').click(function(){
    $('#menu_cont').fadeToggle();
    $(this).hide();
});*/

//新菜单栏
$('.menu,.munu_zg').click(function(){
	if($('.munu_right').width() == 0){
                $('html,body').height($(window).height()).css('overflow','hidden');
		$('.munu_zg').show();
		$('.munu_right').animate({
			'width' : '90%'
		});
		$('html').animate({
			'left' : '-90%'
		});
	}else{
                $('html,body').height('100%').css('overflow','auto');
		$('.munu_zg').hide();
		$('.munu_right').animate({
			'width' : '0'
		});
		$('html').animate({
			'left' : '0'
		});
	}
	
});

$('.ul_box_title').click(function(){	
    if($(this).next('.ul_sub').css('display') != "block"){
        $('.ul_sub').slideUp();
        $(this).next('.ul_sub').slideDown();
    }
});

//统计
var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1253683238'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s95.cnzz.com/z_stat.php%3Fid%3D1253683238%26show%3Dpic' type='text/javascript'%3E%3C/script%3E"));

//把统计移动到版权里
$('#cnzz_stat_icon_1253683238').appendTo('#copyright');

//添加收藏
function sc(sURL, sTitle)
{
    try
    {
        window.external.addFavorite(sURL, sTitle);
    }
    catch (e)
    {
        try
        {
            window.sidebar.addPanel(sTitle, sURL, "");
        }
        catch (e)
        {
            alert("加入收藏失败，请使用Ctrl+D进行添加");
        }
    }
}

//设为首页
function sw_index(obj,url){
  try{
    obj.style.behavior='url(#default#homepage)';
    obj.setHomePage(url);
  }catch(e){
    if(window.netscape){
     try{
       netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
     }catch(e){
       alert("抱歉，此操作被浏览器拒绝！\n\n请在浏览器地址栏输入“about:config”并回车然后将[signed.applets.codebase_principal_support]设置为'true'");
     }
    }else{
    alert("抱歉，您所使用的浏览器无法完成此操作。\n\n您需要手动将【"+url+"】设置为首页。");
    }
 }
}

网页源代码参照

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Cosplay-前端笔记</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1"/>
<meta name="format-detection" content="telephone=no"/>
<link rel="shortcut icon" href="http://qdbj.tk/entry/319671/20141201/19fbf9391ebc5e50254cd8f3e5e84b3a/cosplay_tx_ico.ico" type="image/x-icon" />
<link href="http://wodemo.com/statics/build/css/9f0dd233858d831766ef798559c7998b.css" rel="stylesheet" type="text/css" /><script type="text/javascript" src="http://s.wodemo.com/js/locale.js?lang=zh_CN&t=1422875589&login=0"></script><script type="text/javascript" src="http://wodemo.com/statics/build/js/b3040014b2364a3a5090483624a423d0.js"></script><link href="http://qdbj.tk/skin/cosplay/1419952436/site.css" rel="stylesheet" type="text/css" /><link rel="alternate" href="http://qdbj.tk/feed" type="application/rss+xml" title="RSS"></head>
<body>
<div id="whole_body" class="wo-main-body wo-mode-visitor">

<meta name="baidu-site-verification" content="3G7PjNLEpD" />
<meta name="author" content="Cosplay">
<meta name="copyright" content="Copyright © 2014-2015 Cosplay-前端笔记">
<meta name="description" content="Cosplay-前端笔记 (Cosplay.wodemo.com | qdbj.tk) 记录总结各种经验和技巧，收集与整理各类常用代码、工具、教程，方便前端开发。">
<meta name="keywords" content="cosplay,站点,wodemo,前端笔记,我的磨">

<div class="bulletin">
    <div class="tb_gg"></div>
    <i class="gonggao">公告：</i>
    
<script src="/down/319514/jquery.js"></script>
<div id="scrollDiv">
<div class="scrollText">
  <ul style="margin-top: 0px; ">
      <li>还没加载完? 刷新下试试看吧.</li>
      <li>12.4 修复了浏览器兼容问题.</li>
      <li>生活很多时候总是不如意.</li>
  </ul>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
    $("#scrollDiv").textSlider({line:1,speed:500,timer:3000});
});
</script>

</div>

<div class="search">
 <div class="selarch_box">
  <form action="/search">
  <input type="text" name="q" class="search_test" maxlength="28" value="请输入你想搜索的关键词吧..." onfocus="if(this.value == '请输入你想搜索的关键词吧...'){this.value = ''}" onblur="if(this.value == ''){ this.value = '请输入你想搜索的关键词吧...'}">
  <span class="sel_sc"></span>
  <select name="all" class="search_sel">
    <option value="0">本站</option>
    <option value="1">全站</option>
  </select>
  <input type="submit" class="search_btn" value=" ">
  </form>
 </div>
</div>

<script src="http://qdbj.tk/entry/319671/dfc9182d663dc4d8dc390d714843cf25/xren.js"></script>
<script type="text/javascript">

var isindex = true;
var visitor = "";
</script>
<div id="spig" class="spig">
    <div id="message">正在加载中……</div>
    <div id="mumu" class="mumu"></div>
</div>

<div class="munu_zg" style="display: none"></div>
<div class="munu_right" style="width: 0px">
<ul class="ul_box">
	<li>
		<span class="ul_box_title">互动</span>
		<ul class="ul_sub" style="display:block">
			<li><a href="javascript:alert('留言板还在制作中哦～')">在线留言</a></li>
			<li><a href="http://qdbj.tk/entry/322222">友情链接</a></li>
			<li><a href="http://qdbj.tk/entry/319990">关于我们</a></li>
		</ul>
	</li>

<li>
		<span class="ul_box_title">WEB</span>
		<ul class="ul_sub">
			<li><a href="javascript:void(0)" onclick="location.href='/cat/245632'">CSS3</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/276463'">HTML5</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/276464'">Jquery</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/276465'">PHP</a></li>
                        <li><a href="javascript:void(0)" onclick="location.href='/cat/276466'">MySQL</a></li>
		</ul>
	</li>

<li>
		<span class="ul_box_title">开发/设计</span>
		<ul class="ul_sub">
			<li><a href="javascript:void(0)" onclick="location.href='/cat/269740'">插件</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/269741'">素材</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/275946'">字体</a></li>
			<li><a href="javascript:void(0)" onclick="location.href='/cat/245635'">工具</a></li>
                        <li><a href="javascript:void(0)" onclick="location.href='/cat/276488'">手册</a></li>
                        <li><a href="javascript:void(0)" onclick="location.href='/cat/277031'">浏览器</a></li>
		</ul>
	</li>
</ul>
</div>
<span id="ln-h"><a href="/">首页</a> </span>
<a href="/cat/269742">笔记</a> <a href="/cat/245633">动漫</a> <a href="/cat/245631">安卓</a> <a href="/cat/269737">漫音</a> <a href="/cat/245634">教程</a> <a href="/cat/269739">源码</a> <a href="/cat/269740">插件</a> <a href="/cat/269741">素材</a> <a href="/cat/245632">美图</a> <a href="/cat/245635">工具</a> <a href="/cat/269743">电脑</a> <a href="/cat/269738">个人</a> <a href="/cat/276488">手册</a> <a href="/cat/277031">浏览器</a> <a href="/cat/275945">MAD</a> <a href="/cat/275946">字体</a> <a href="/cat/275947">电影</a> <a href="/cat/275948">游戏</a> <a href="/cat/275949">剧场</a> <a href="/cat/275950">OVA</a> <a href="/cat/276462">CSS3</a> <a href="/cat/276463">HTML5</a> <a href="/cat/276464">Jquery</a> <a href="/cat/276465">PHP</a> <a href="/cat/276466">MySQL</a> <a href="/cat/276730">其它</a> <hr />
<ul class="file_list"><li> <a href="http://qdbj.tk/entry/326218">[动漫]-舰娘 Collection 720P</a></li><li> <a href="http://qdbj.tk/entry/325685">[笔记]-jQuery trigger() 自动调用方法</a></li><li> <a href="http://qdbj.tk/entry/325684">[笔记]-jQuery delay() 延迟加载方法</a></li><li> <a href="http://qdbj.tk/entry/325385">[动漫][BD]-学园默示录 720P</a></li><li> <a href="http://qdbj.tk/file/325176">Android 鸡毛信免费电话</a><span>(apk)</span></li><li> <a href="http://qdbj.tk/entry/324257">[动漫]-Another 720P</a></li><li> <a href="http://qdbj.tk/entry/324252">[动漫]-Blood-c 720P</a></li><li> <a href="http://qdbj.tk/entry/323801">[动漫]-武装神姬 720P</a></li><li> <a href="http://qdbj.tk/entry/323719">[动漫]-七人魔法使 720P</a></li><li> <a href="http://qdbj.tk/entry/323716">[动漫]-我要成为双马尾 720P</a></li><li> <a href="http://qdbj.tk/entry/323714">[动漫]-关于完全听不懂老公在说什么事 720P</a></li><li> <a href="http://qdbj.tk/entry/323713">[动漫]-斩·赤红之瞳 720P</a></li><li> <a href="http://qdbj.tk/file/323690">初音未来 - 右肩の蝶</a><span>(mp3)</span></li><li> <a href="http://qdbj.tk/file/323632">初音未来 - 甩葱歌</a><span>(mp3)</span></li><li> <a href="http://qdbj.tk/file/323631">初音未来 - 圆周率</a><span>(mp3)</span></li></ul><p>
<p>
<span class="pagination"> <span class="page_no_link">首页</span> <span class="page_no_link">上一页</span> <a href='/filelist?next=323631'>下一页</a> <a href='/filelist?next=end'>末页</a> </span></p>
</p>
<div class="wo-search-form wo-search-home">
<form action="/search">
<input type="text" name="q" value="">
<input type="submit" value="搜索" />
</form>

</div>
<br />
<br />

<span class="wo-latest-link"><a href="http://wodemo.com/latest">最新</a></span>
<span class="wo-site-feed-link">| <a href="http://qdbj.tk/subscribe">订阅</a></span>
| <a href="http://wodemo.com/reg?return_to=http%3A%2F%2Fcosplay.wodemo.com%2F">注册</a>
| <a href="http://wodemo.com/login?return_to=http%3A%2F%2Fcosplay.wodemo.com%2F">登录</a>
</script>
<span class="wo-lang-link">
|
<a href="http://cosplay.wodemo.com/setlang/en?return_to=http%3A%2F%2Fcosplay.wodemo.com%2F">English</a></span>

</div>

【本站仅供参考，版权归原作者所有】