<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
.d span{
counter-increment: linenumber;
}
.d span:before{
content: counter(linenumber);
color: #999;
display: block;
padding-right: 5px;
padding-left: 10px;
text-align: right;
border-right: 1px solid #000;
line-height: 20px;
}
.body{
position: relative;
width: 1000px;
height: 900px;
margin: 0 auto;
padding-top: 10px;
overflow: auto;
border-left: 5px solid #558abb;
background: url(https://developer.cdn.mozilla.net/static/img/blueprint-dark.fd85a7a074ae.png);
}
i,pre{
line-height: 20px;
}
pre{
}
.d{
position: absolute;
top: 10px;
left: 0;
}
textarea{
display: none;
position: absolute;
top: 10px;
left: 40px;
width: 100%;
line-height: 20px;
resize: none;
}
.as{
}
pre .green{
color: #14CB04;
}
pre .blue{
color: #1393E6;
}
pre .red{
color: #CE0707;
}
pre .green{
color: #14CB04;
}
</style>
</head>
<body>
<div class="body">
<textarea wrap="off">
/*var dataUrl='http://dhudong.cztv.com/'
inits();*/
$(window).resize(function(){
inits();
});
function inits(){
var w=$(window).width();
var h=$(window).height();
$(".alert").css({width:w,height:h})
};
$(function(){
$(".alert,.alert .alertBox span").click(function(){
$(".alert").hide();
})
$(".alert .alertBox").click(function(e){
e.stopPropagation();
})
})
var list={
init:function(){
list(1);
$.ajax({
url: dataUrl+'activity/getworklist?channel_id=1&activity_id=21&page=1&pagenum=100000&work_type=1',
type:'get',
dataType:'jsonp',
success:function(rlt){
var len=rlt.data.length;
var pageNum=Math.ceil(len/12);
var page='<div id="Pagination"></div>'+
'<div class="searchPage">'+
'<span class="page-sum">共<strong class="allPage" style="margin: 0 5px;">'+pageNum+'</strong>页</span>'+
'</div>'
$(".pagebar").append(page);
$("#Pagination").pagination(pageNum,{
num_edge_entries: 1, //边缘页数
num_display_entries: 4, //主体页数
callback: pageselectCallback,
items_per_page: 1, //每页显示1项
prev_text: "前一页",
next_text: "后一页"
});
}
});
function pageselectCallback(pIndex){
list(pIndex+1)
}
function list(num){
$.ajax({
url: dataUrl+'activity/getworklist?channel_id=1&activity_id=21&page='+num+'&pagenum=12&work_type=1',
type:'get',
dataType:'jsonp',
success:function(rlt){
$(".list-page ul").empty();
for(var i=0,j=1;i<rlt.data.length;i++,j++){
if(j%3!=0||j==0){
var html='<li class="mr">';
}else{
var html='<li>';
}
html+='<a href="http://mhudong.cztv.com/245769?vid='+rlt.data[i].work_id+'" target="_blank">'+
'<div class="video-box">'+
'<img src="'+rlt.data[i].work_picture+'" alt="">'+
'</div>'+
'<p class="list-title">'+rlt.data[i].work_title+'</p>'+
'<p class="list-intro">'+rlt.data[i].work_intro+'</p>'+
'</a>'+
'</li>'
$(".list-page ul").append(html)
}
}
})
}
}
}
var config='';
//flash调用函数
/*function getVideoConfig(){
return config;
}*/</textarea>
<pre class="as">
</pre>
<div class='d'>
</div>
</div>
<script type="text/javascript" src='js/jquery.min.js'></script>
<script type="text/javascript">
var html=$("textarea").val();
console.log()
$('pre').html(html.replace(/</g,'<'));
for(var i=0;i<html.match(/\ \/\/(\S*)/g).length;i++){
html = $('pre').html();
$('pre').html(html.replace(html.match(/\ \/\/(\S*)/g)[i],'<span class="green">'+html.match(/\ \/\/(\S*)/g)[i]+'</span>'));
}
for(var i=0;i<html.match(/\n\/\/(\S*)/g).length;i++){
html = $('pre').html();
$('pre').html(html.replace(html.match(/\n\/\/(\S*)/g)[i],'<span class="green">'+html.match(/\n\/\/(\S*)/g)[i]+'</span>'));
}
html = $('pre').html();
for(var i=0;i<html.match(/'(\S*)'/g).length;i++){
console.log(html.match(/'(\S*)'/g)[i])
html = $('pre').html();
$('pre').html(html.replace(html.match(/'(\S*)'/g)[i],'<span class="green">'+html.match(/'(\S*)'/g)[i]+'</span>'));
}
html = $('pre').html();
$('pre').html(html.replace(/function/g,'<span class="blue">function</span>'));
html = $('pre').html();
$('pre').html(html.replace(/var /g,'<span class="blue">var </span>'));
html = $('pre').html();
$('pre').html(html.replace(/\nvar /g,'<span class="blue">\nvar </span>'));
html = $('pre').html();
$('pre').html(html.replace(/width/g,'<span class="blue">width</span>'));
html = $('pre').html();
$('pre').html(html.replace(/height/g,'<span class="blue">height</span>'));
html = $('pre').html();
$('pre').html(html.replace(/[$]+/g,'<span class="red">$</span>'));
html = $('pre').html();
$('pre').html(html.replace(/window/g,'<span class="blue">window</span>'));
var h=$('pre').height();
$("textarea").height(h)
for(var i=0;i<h/20;i++){
$(".d").append('<span></span>')
}
$("pre").css({marginLeft:$(".d").width()+5})
$("textarea").css({left:$(".d").width()+5,width:$("pre").width()})
</script>
</body>
</html>