بسم الله الرحمن الرحيم
اقدم لكم قالب مطور بأعلى التقنيات المتواجدة حتى الان ...
لا يوجد مثال له حتى الان لانى احترت اضع اى مثال لاى تقنية لذلك وضعت القالب كاملا ليتمتع به كل اعضاء المنتدى الكرام
القالب مخصوص للنسخة:PunBB
اسم القالب هو :topics_list_box
اقدم لكم قالب مطور بأعلى التقنيات المتواجدة حتى الان ...
لا يوجد مثال له حتى الان لانى احترت اضع اى مثال لاى تقنية لذلك وضعت القالب كاملا ليتمتع به كل اعضاء المنتدى الكرام
القالب مخصوص للنسخة:PunBB
اسم القالب هو :topics_list_box
الكود:
<!-- BEGIN topics_list_box -->
<!-- BEGIN row -->
<!-- BEGIN header_table -->
<!-- BEGIN multi_selection -->
<script type="text/javascript">
function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
var all_checked = true;
for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
}
}
document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
}
function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
}
}
}
</script>
<!-- END multi_selection -->
<div class="main-head">
<!-- BEGIN multi_selection -->
<input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
<!-- END multi_selection -->
<h1 class="page-title">{topics_list_box.row.L_TITLE} [{topics_list_box.row.COUNT_TOTAL_TOPICS}]</h1>
</div>
<div class="main-content" id="nesa_api">
<table cellspacing="0" class="table">
<tbody class="statused">
<!-- END header_table -->
<!-- BEGIN header_row -->
<strong>{topics_list_box.row.L_TITLE}</strong>
<!-- END header_row -->
<!-- BEGIN topic -->
<!-- BEGIN table_sticky -->
</tbody>
</table>
</div>
<div class="main-head">
<!-- BEGIN multi_selection -->
<input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" / >
<!-- END multi_selection -->
<h2>{topics_list_box.row.topic.table_sticky.L_TITLE} [{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
</div>
<div class="main-content">
<table cellspacing="0" class="table">
<thead>
<tr>
<th class="tcl">{L_TOPICS}</th>
<th class="tc2">{topics_list_box.row.topic.table_sticky.L_REPLIES}</th>
<th class="tc3">{topics_list_box.row.topic.table_sticky.L_VIEWS}</th>
<th class="tcr">{topics_list_box.row.topic.table_sticky.L_LASTPOST}</th>
</tr>
</thead>
<tbody class="statused">
<!-- END table_sticky -->
<tr>
<td class="tcl tdtopics <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
<span class="status">
<img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
</span>
<!-- BEGIN single_selection -->
<input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />
<!-- END single_selection -->
{topics_list_box.row.ICON}
{topics_list_box.row.NEWEST_POST_IMG}
{topics_list_box.row.PARTICIPATE_POST_IMG}
{topics_list_box.row.TOPIC_TYPE}
<h2 class="topic-title"><a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a></h2>
{topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}
{topics_list_box.row.L_BY} {topics_list_box.row.TOPIC_AUTHOR}
<!-- BEGIN switch_description -->
<br />
{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
<!-- END switch_description -->
</td>
<td class="tc2 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">{topics_list_box.row.REPLIES}</td>
<td class="tc3 <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->"><div class="visuali" stat="{topics_list_box.row.VIEWS}"></div></td>
<td class="tcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
<!-- BEGIN avatar -->
<span class="lastpost-avatar">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
<!-- END avatar -->
<span class="postData">{topics_list_box.row.LAST_POST_TIME}</span> {topics_list_box.row.L_BY} {topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}
<div class="respN" stat="{topics_list_box.row.REPLIES} المساهمات"></div><div class="popuHW"><div class="barRep" style="width: {topics_list_box.row.REPLIES}%;" stat="{topics_list_box.row.REPLIES}"></div></div>
</td>
<!-- BEGIN multi_selection -->
<td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
<!-- END multi_selection -->
</tr>
<!-- END topic -->
<!-- BEGIN no_topics -->
<tr>
<td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
</tr>
<!-- END no_topics -->
<!-- BEGIN bottom -->
</tbody>
</table>
</div>
<div class="main-foot clearfix">
<!-- BEGIN multi_selection -->
<input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
<!-- END multi_selection -->
<p class="h2">{L_TOPICS} [{topics_list_box.row.bottom.COUNT_TOTAL_TOPICS}]</p>
<p class="options">
<a href="{U_MARK_READ}">{L_MARK_TOPICS_READ}</a> {S_WATCH_FORUM} <a href="#top">{L_BACK_TO_TOP}</a>
</p>
</div>
<!-- END bottom -->
<!-- BEGIN spacer --><br /><!-- END spacer -->
<!-- END row -->
<!-- END topics_list_box -->
<style>
.visuali {
background: url("http://i.imgur.com/ViFyMEG.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
margin-top: 20px;
height: 12px;
right: 50px;
width: 73px;
}
.visuali:after {
background: #18b0eb;
border-radius: 2px;
bottom: 30px;
color: #fff;
content: attr(sta);
display: block;
font: bold 12px 'Open Sans', 'Lato', sans-serif;
left: 6px;
padding: 3px 0;
position: relative;
text-align: center;
text-shadow: 0 1px 0 #1297ca;
width: 100px;
}
.visuali:before {
border-left: 5px solid rgba(0, 0, 0, 0);
border-right: 5px solid rgba(0, 0, 0, 0);
border-top: 5px solid #18b0eb;
bottom: 6px;
content: " ";
display: block;
height: 0;
left: 0px;
position: relative;
width: 0;
}
.visuali:before, .visuali:after {
opacity: 0;
transition-duration: 0.5s;
}
.visuali:hover:after, .visuali:hover:before {
opacity: 1;
}
.popuHW {
background: none repeat scroll 0 0 #e2e2e2;
border-radius: 4px;
bottom: 5px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16) inset;
height: 5px;
margin-top: 25px;
overflow: hidden;
position: relative;
right: 0;
width: 250px;
}
.barRep {
background: -moz-linear-gradient(center top , #83c200, #71a00e) repeat scroll 0 0 rgba(0, 0, 0, 0);
border-radius: 4px;
height: 5px;
max-width: 250px !important;
}
.barRep[style="width: 0%;"], .barRep[style="width: 1%;"], .barRep[style="width: 2%;"], .barRep[style="width: 3%;"], .barRep[style="width: 4%;"], .barRep[style="width: 5%;"], .barRep[style="width: 6%;"], .barRep[style="width: 7%;"], .barRep[style="width: 8%;"], .barRep[style="width: 9%;"], .barRep[style="width: 10%;"], .barRep[style="width: 11%;"], .barRep[style="width: 12%;"], .barRep[style="width: 13%;"], .barRep[style="width: 14%;"], .barRep[style="width: 15%;"], .barRep[style="width: 16%;"], .barRep[style="width: 17%;"], .barRep[style="width: 18%;"], .barRep[style="width: 19%;"], .barRep[style="width: 20%;"], .barRep[style="width: 21%;"], .barRep[style="width: 22%;"], .barRep[style="width: 23%;"], .barRep[style="width: 24%;"], .barRep[style="width: 25%;"], .barRep[style="width: 26%;"], .barRep[style="width: 27%;"], .barRep[style="width: 28%;"], .barRep[style="width: 29%;"], .barRep[style="width: 30%;"], .barRep[style="width: 31%;"], .barRep[style="width: 32%;"], .barRep[style="width: 33%;"], .barRep[style="width: 34%;"], .barRep[style="width: 35%;"] {
background: -moz-linear-gradient(center top , #40b6fd, #009fff) repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.barRep[style="width: 36%;"], .barRep[style="width: 37%;"], .barRep[style="width: 38%;"], .barRep[style="width: 39%;"], .barRep[style="width: 40%;"], .barRep[style="width: 41%;"], .barRep[style="width: 42%;"], .barRep[style="width: 43%;"], .barRep[style="width: 44%;"], .barRep[style="width: 45%;"], .barRep[style="width: 46%;"], .barRep[style="width: 47%;"], .barRep[style="width: 48%;"], .barRep[style="width: 49%;"], .barRep[style="width: 50%;"], .barRep[style="width: 51%;"], .barRep[style="width: 52%;"], .barRep[style="width: 53%;"], .barRep[style="width: 54%;"], .barRep[style="width: 55%;"], .barRep[style="width: 56%;"], .barRep[style="width: 57%;"], .barRep[style="width: 58%;"], .barRep[style="width: 59%;"], .barRep[style="width: 60%;"], .barRep[style="width: 61%;"], .barRep[style="width: 62%;"], .barRep[style="width: 63%;"], .barRep[style="width: 64%;"], .barRep[style="width: 65%;"] {
background: -moz-linear-gradient(center top , #e99b00, #ff811f) repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.respN {
height: 6px;
margin-left: 50px;
margin-top: 18px;
position: absolute;
width: 250px;
}
.popuHW .respN:after,.popuHW .respN:before, .respN:hover:after, .respN:hover:before {
opacity: 1;
}
.respN:before, .respN:after {
opacity: 0;
transition-duration: 0.5s;
}
.respN:before {
border-left: 5px solid rgba(0, 0, 0, 0);
border-right: 5px solid rgba(0, 0, 0, 0);
border-top: 5px solid #18B0EB;
bottom: 5px;
content: " ";
display: block;
height: 0;
left: 0px;
position: relative;
width: 0;
}
.respN:after {
background: #18B0EB;
border-radius: 2px;
bottom: 29px;
color: #fff;
content: attr(stat);
display: block;
font: bold 12px 'Open Sans', 'Lato', sans-serif;
left: 6px;
padding: 3px 0;
position: relative;
text-align: center;
text-shadow: 0 1px 0 #000;
width: 150px;
}
</style>
<script>
jQuery(function(){
eval(function(p,a,c,k,e,d){while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+c+'\\b','g'),k[c])}}return p}('5=18(\'.45\').68;18(\'.45\').38(34(){6 31=18(22).24(\'28\');6 42=(31/5).48(0);18(22).7(\'69\',42+\'%\')});18(\'.37\').38(34(){6 31=18(22).24(\'28\');6 46=31/5;6 47=46.48(0);18(22).24(\'70\',31);18(22).24(\'28\',47)});18(\'.67 66\').38(34(){4=0;23=0;26=0;6 50=18(22).29(\'.62\').63();6 51=[\'\',\'64\',\'65\',\'71\',\'72\',\'79\',\'82\',\'83\',\'78\',\'77\',\'59\',\'74\',\'75\'];6 32=/(\\76+) (\\27+), (\\27+)/.84(50);6 49=32[2];6 43=51.54(32[1]);6 39=32[3];6 44=49+43+39;6 27=58 57();6 36=27.56()+1;6 33=27.55();6 53=(33<10?\'0\':\'\')+33+(36<10?\'0\':\'\')+36+27.73();26=(53-44)/85;23=18(22).29(\'.52\').24(\'28\').106(/[0-99]+/).102();13(23==1){18(22).29(\'.52\').24(\'28\',\'1 103\')}4=18(22).29(\'.37\').24(\'28\');6 8=18(22).29(\'.37\');13((4>=1)&&(4<=20)){8.7(\'17\',\'16("9://5.11.14/109.12")\')}19 13((4>=21)&&(4<=40)){8.7(\'17\',\'16("9://5.11.14/89.12")\')}19 13((4>=41)&&(4<=60)){8.7(\'17\',\'16("9://5.11.14/87.12")\')}19 13((4>=61)&&(4<=80)){8.7(\'17\',\'16("9://5.11.14/96.12")\')}19 13((4>=81)&&(4<=100)){8.7(\'17\',\'16("9://5.11.14/93.12")\')}19 13((4>=101)&&(4<=92)){13((26<30)&&23>10){8.7(\'17\',\'16("9://5.11.14/97.12")\')}19{8.7(\'17\',\'16("9://5.11.14/104.12")\')}}19 13((4>=113)&&(4<=94)){13((26<30)&&23>15){8.7(\'17\',\'16("9://5.11.14/91.12")\')}19{8.7(\'17\',\'16("9://5.11.14/86.12")\')}}19 13((4>=88)&&(4<=90)){13((26<30)&&23>20){8.7(\'17\',\'16("9://5.11.14/98.12")\')}19{8.7(\'17\',\'16("9://5.11.14/110.12")\')}}19 13((4>=111)&&(4<=108)){13((26<30)&&23>25){8.7(\'17\',\'16("9://5.11.14/105.12")\')}19{8.7(\'17\',\'16("9://5.11.14/95.12")\')}}19{13((26<30)&&23>35){8.7(\'17\',\'16("9://5.11.14/107.12")\')}19{8.7(\'17\',\'16("9://5.11.14/112.12")\')}}});',10,114,'||||vis|i|var|css|tvs|http||imgur|png|if|com||url|background|jQuery|else|||this|resp|attr||postTime|d|stat|find||att|m|day|function||month|visuali|each|ano|||widt|mes|date|barRep|num|numb|toFixed|dia|data|meses|respN|output|indexOf|getDate|getMonth|Date|new|Out|||postData|text|Jan|Fev|tr|statused|length|width|sta|Mar|Abr|getFullYear|Nov|Dez|w|Set|Ago|Maio|||Jun|Jul|exec|1000000|2hvADNM|ROXGqTE|141|MuPtV3m|160|CbFTPnM|120|hYqLbmF|140|ziRBtQ8|iRph5iv|qiMvzrL|APIhQSw||||toString|Resposta|3LSTxfB|TmeZdLD|match|Q2JgrGS|180|mJH6CcZ|occYLvS|161|dm5QnCN|121'.split('|')))
});
</script>