Данный скрипт позволяет реализовать вид заполнения профиля и репутации как вконтакте,то есть если человек заполняет не все поля которые у вас в настройках то будет не 100% отображать а 60% или 70% если же он его вообще не заполнял то 30% и конечно же если в дальнейшем юзеру будут + репутацию то его рейтинг будет становиться всё больше и больше и другим цветом.
Установка скрипта:
Заходим в админку потом в Персональная страница пользователя и вставляем перед < /body>
Code
<script>
// Автор скрипта: Ваня Ефимов
function rep_load()
{
var email=<?if($_EMAIL_IS_VERIFIED$)?>20<?else?>0<?endif?>;
var avatar=<?if($_AVATAR$)?>25<?else?>0<?endif?>;
var about=<?if($_SIGNATURE$)?>15<?else?>0<?endif?>;
var icq=<?if($_ICQ$)?>10<?else?>0<?endif?>;
var www=<?if($_MSN$)?>10<?else?>0<?endif?>;
var city=<?if($_AOL$)?>10<?else?>0<?endif?>;
var bday=<?if($_BIRTHDAY$)?>0<?else?>0<?endif?>;
var gender=<?if($_GENDER_NAME$)?>10<?else?>0<?endif?>;
var information=avatar+icq+bday+gender+email+www+city+about;
var rate=<?if($_REPUTATION$)?>$_REPUTATION$<?else?>0<?endif?>;
var rep_1=information*2;
var rep_2=200-rep_1;
var rep_3=rate*2;
var rep_4=200-rep_3;
var rep_5=(rate-100)*2;
var rep_6=200-rep_5;
var rep_7=(rate-200)*2;
var rep_8=200-rep_7;
var rep_9=(rate-300)*2;
var rep_10=200-rep_9;
var rep_11=rate*0.01;
var rep_12=200-rep_11;
if (rate > 0 && rate <= 100 && information == 100)
{
$('#r100200').css('display','block');
$('#rep_3').css('width',''+rep_3+'px');
$('#rep_4').css('width',''+rep_4+'px');
$('#rep_number').css('color','#A39B66');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
else
{
if (rate > 100 && rate <= 200 && information == 100)
{
$('#r200300').css('display','block');
$('#rep_5').css('width',''+rep_5+'px');
$('#rep_6').css('width',''+rep_6+'px');
$('#rep_number').css('color','#8A8048');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (rate > 200 && rate <= 300 && information == 100)
{
$('#r300400').css('display','block');
$('#rep_7').css('width',''+rep_7+'px');
$('#rep_8').css('width',''+rep_8+'px');
$('#rep_number').css('color','#F8F7ED');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (rate > 300 && rate <= 400 && information == 100)
{
$('#r400500').css('display','block');
$('#rep_9').css('width',''+rep_9+'px');
$('#rep_10').css('width',''+rep_10+'px');
$('#rep_number').css('color','#F4F2E8');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (rate > 400 && information == 100)
{
$('#r500').css('display','block');
$('#rep_11').css('width',''+rep_11+'px');
$('#rep_12').css('width',''+rep_12+'px');
$('#rep_number').css('color','#F4F2E8');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (information < 100 || rate == 0)
{
$('#r0100').css('display','block');
$('#rep_1').css('width',''+rep_1+'px');
$('#rep_2').css('width',''+rep_2+'px');
$('#rep_number').css('color','#7790AE');
document.getElementById('rep_number').innerHTML=information+'%';
}
}
}
</script>
// Автор скрипта: Ваня Ефимов
function rep_load()
{
var email=<?if($_EMAIL_IS_VERIFIED$)?>20<?else?>0<?endif?>;
var avatar=<?if($_AVATAR$)?>25<?else?>0<?endif?>;
var about=<?if($_SIGNATURE$)?>15<?else?>0<?endif?>;
var icq=<?if($_ICQ$)?>10<?else?>0<?endif?>;
var www=<?if($_MSN$)?>10<?else?>0<?endif?>;
var city=<?if($_AOL$)?>10<?else?>0<?endif?>;
var bday=<?if($_BIRTHDAY$)?>0<?else?>0<?endif?>;
var gender=<?if($_GENDER_NAME$)?>10<?else?>0<?endif?>;
var information=avatar+icq+bday+gender+email+www+city+about;
var rate=<?if($_REPUTATION$)?>$_REPUTATION$<?else?>0<?endif?>;
var rep_1=information*2;
var rep_2=200-rep_1;
var rep_3=rate*2;
var rep_4=200-rep_3;
var rep_5=(rate-100)*2;
var rep_6=200-rep_5;
var rep_7=(rate-200)*2;
var rep_8=200-rep_7;
var rep_9=(rate-300)*2;
var rep_10=200-rep_9;
var rep_11=rate*0.01;
var rep_12=200-rep_11;
if (rate > 0 && rate <= 100 && information == 100)
{
$('#r100200').css('display','block');
$('#rep_3').css('width',''+rep_3+'px');
$('#rep_4').css('width',''+rep_4+'px');
$('#rep_number').css('color','#A39B66');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
else
{
if (rate > 100 && rate <= 200 && information == 100)
{
$('#r200300').css('display','block');
$('#rep_5').css('width',''+rep_5+'px');
$('#rep_6').css('width',''+rep_6+'px');
$('#rep_number').css('color','#8A8048');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (rate > 200 && rate <= 300 && information == 100)
{
$('#r300400').css('display','block');
$('#rep_7').css('width',''+rep_7+'px');
$('#rep_8').css('width',''+rep_8+'px');
$('#rep_number').css('color','#F8F7ED');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (rate > 300 && rate <= 400 && information == 100)
{
$('#r400500').css('display','block');
$('#rep_9').css('width',''+rep_9+'px');
$('#rep_10').css('width',''+rep_10+'px');
$('#rep_number').css('color','#F4F2E8');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (rate > 400 && information == 100)
{
$('#r500').css('display','block');
$('#rep_11').css('width',''+rep_11+'px');
$('#rep_12').css('width',''+rep_12+'px');
$('#rep_number').css('color','#F4F2E8');
document.getElementById('rep_number').innerHTML=100+rate+'%';
}
if (information < 100 || rate == 0)
{
$('#r0100').css('display','block');
$('#rep_1').css('width',''+rep_1+'px');
$('#rep_2').css('width',''+rep_2+'px');
$('#rep_number').css('color','#7790AE');
document.getElementById('rep_number').innerHTML=information+'%';
}
}
}
</script>
Потом находим < body> есть такой код на верху кода возле хеад и меняем его на:
Code
<body onload="rep_load();">
В css чтобы отображалось нормально:
Code
#rep_1 {width:0px;height:17px;border-top: 1px solid #C0CCD9;background:#DAE2E8;}
#rep_2 {width:200px;height:17px;border-top: 1px solid #E6E6E6;background:#F7F7F7;}
#rep_3 {width:0px;height:17px;border-top: 1px solid #CCC490;background:#E0D7A3;}
#rep_4 {width:200px;height:17px;border-top: 1px solid #E2DAA6;background:#F5EBBB;}
#rep_5 {width:0px;height:17px;border-top: 1px solid #B7AE77;background:#C7BD81;}
#rep_6 {width:200px;height:17px;border-top: 1px solid #CCC490;background:#E0D7A3;}
#rep_7 {width:0px;height:17px;border-top: 1px solid #998F55;background:#B4A968;}
#rep_8 {width:200px;height:17px;border-top: 1px solid #B7AE77;background:#C7BD81;}
#rep_9 {width:0px;height:17px;border-top: 1px solid #83793C;background:#A29755;}
#rep_10 {width:200px;height:17px;border-top: 1px solid #998F55;background:#B4A968;}
#rep_11 {width:0px;height:17px;border-top: 1px solid #655A19;background:#81773C;}
#rep_12 {width:200px;height:17px;border-top: 1px solid #83793C;background:#A29755;}
a.fNavlink:link {background-color: #f1f1f1;padding:3px;border: 1px solid #cccccc;text-decoration:none; color:#4e4e4e;!important;}
a.fNavLink:hover {background-color: #ffffff;padding:3px;border: 1px solid #ccccccc;text-decoration:none; color:#4e4e4e;!important;}
a.fNavLink:visited {background-color: #f1f1f1;padding:3px;border: 1px solid #cccccc;text-decoration:none; color:#4e4e4e;!important;}
a.fNavLink:active {background-color: #ffffff;padding:3px;border: 1px solid #cccccc;text-decoration:none; color:#4e4e4e;!important;}
И данный код где хотите чтобы выводилась картинка с процентами ( Желательно настроить под себя как это сделал я):
Code
<div class="rateline">
<span id="ratenum">
<div style="position:absolute;padding-top:2px;width:200px;text-align:center;" id="rep_number"></div>
</span>
</div>
<div>
<table border="0" cellpadding="0" cellspacing="0" width="200px" height="18px">
<tr id="r0100" style="display:none;">
<td valign="top">
<div id="rep_1"></div>
</td>
<td valign="top">
<div id="rep_2"></div>
</td>
</tr>
<tr id="r100200" style="display:none;">
<td valign="top">
<div id="rep_3"></div>
</td>
<td valign="top">
<div id="rep_4"></div>
</td>
</tr>
<tr id="r200300" style="display:none;">
<td valign="top">
<div id="rep_5"></div>
</td>
<td valign="top">
<div id="rep_6"></div>
</td>
</tr>
<tr id="r300400" style="display:none;">
<td valign="top">
<div id="rep_7"></div>
</td>
<td valign="top">
<div id="rep_8"></div>
</td>
</tr>
<tr id="r400500" style="display:none;">
<td valign="top">
<div id="rep_9"></div>
</td>
<td valign="top">
<div id="rep_10"></div>
</td>
</tr>
<tr id="r500" style="display:none;">
<td valign="top">
<div id="rep_11"></div>
</td>
<td valign="top">
<div id="rep_12"></div>
</td>
</tr>
</table>
</div>
<span id="ratenum">
<div style="position:absolute;padding-top:2px;width:200px;text-align:center;" id="rep_number"></div>
</span>
</div>
<div>
<table border="0" cellpadding="0" cellspacing="0" width="200px" height="18px">
<tr id="r0100" style="display:none;">
<td valign="top">
<div id="rep_1"></div>
</td>
<td valign="top">
<div id="rep_2"></div>
</td>
</tr>
<tr id="r100200" style="display:none;">
<td valign="top">
<div id="rep_3"></div>
</td>
<td valign="top">
<div id="rep_4"></div>
</td>
</tr>
<tr id="r200300" style="display:none;">
<td valign="top">
<div id="rep_5"></div>
</td>
<td valign="top">
<div id="rep_6"></div>
</td>
</tr>
<tr id="r300400" style="display:none;">
<td valign="top">
<div id="rep_7"></div>
</td>
<td valign="top">
<div id="rep_8"></div>
</td>
</tr>
<tr id="r400500" style="display:none;">
<td valign="top">
<div id="rep_9"></div>
</td>
<td valign="top">
<div id="rep_10"></div>
</td>
</tr>
<tr id="r500" style="display:none;">
<td valign="top">
<div id="rep_11"></div>
</td>
<td valign="top">
<div id="rep_12"></div>
</td>
</tr>
</table>
</div>
Автор: Ваня Ефимов,если кто хочет посмотреть как работает идите сюда Только я убрал с ксс полоски по этому их нету!
Теги:
Проверить тиц
Витрина ссылок
