Рейтинг самых позитивных/негативных
Добавляет список с рейтингом пользователей, оценивающих посты (поставили больше всего плюсов/минусов).
Автор: Romych
Платформа: MyBB
Демо: ДЕМО
Переключение списков нажатием на вкладки
Устанавливать на отдельной странице или в Объявление
<!-- Рейтинг самых позитивных/негативных --> <style type="text/css"> #joper {width: 100%;text-align: center; margin:0 auto;} .tabz {height: 25px;line-height: 20px;margin: 0 0 3px;list-style: none; } .tabz li {float: left;margin-right: 1px; cursor:pointer;background: url("//uploads.ru/i/P/5/Q/P5Q2V.png") no-repeat scroll -366px 0 transparent;background-position-x: -366px;background-position-y: 0px;color: #444444;display: block;margin-bottom: -1px;padding: 0 14px 1px;text-align: center;text-decoration: none;width: 126px;height: 29px; } .tabz li:hover {color:#EFEFEF;padding: 0 14px;background: url("//uploads.ru/i/P/5/Q/P5Q2V.png")no-repeat scroll;background-position: -366px -31px; text-decoration:none; } .tabz .active {color: #444;padding: 0px 14px 2px;border: medium hidden;line-height: 22px;background-position: -366px -61px; } input[type="text"] {background:transparent;border:none !important;padding:0 !important;text-align:center;vertical-align:sub;width:84px;} input[type="text"]:hover {color: #cbc3f7; } .tabz .active input[type="text"]:hover {color: #cbc3f7;} div[class^="t-"]:not(.t-0) {display: none;} div[class^="t-"] {background: #fbfbfb;border: 1px solid #888;border-radius: 0 0 9px 9px;padding: 0 5px 5px;counter-reset: span;width: 297px; } #us_min img{border:1px solid #696969;border-radius: 9px;-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);filter: grayscale(100%);transition: all 0.5s ease; } #us_min figure {display:block;height: 52px;width: 52px;position: relative;overflow:hidden;text-align: center; } #us_min figcaption {display:block; width:50px;background:rgba(255, 46, 0, 0.8);border-radius: 0 0 7px 7px;box-shadow: 0 0 5px #40310A inset;color: #fff; font-weight: bold;font-size: 12px;height: 15px;left: 1px;position: absolute;top: 36px;text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2 ); } #us_min td img:hover {-webkit-filter: grayscale(0%);-moz-filter: grayscale(0%);filter: grayscale(0%); } .tipsy-inner {background-color:#004d66; color:white; max-width:200px; } #us_min th,#us_poz th {border-radius: 7px;height: 22px;font-size: small; } #us_poz img{border:1px solid #696969;border-radius: 9px; } #us_poz figure {display:block;height: 52px;width: 52px;position: relative;overflow:hidden;text-align: center; } #us_poz figcaption {display:block; width:50px;background:rgba(245, 124, 0, 0.8);border-radius: 0 0 7px 7px;box-shadow: 0 0 5px #40310A inset;color: #fff; font-size: 0.8em;font-weight: bold;font-size: 12px;height: 15px;left: 1px;position: absolute;top: 36px;text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2 ); } </style> <div id="joper"> <ul class="tabz"> <li class="t-0 active"> ✚ </li> <li class="t-1"> − </li> </ul> <div class="t-0"><table id="us_poz" cellspacing="5" style=""></table></div> <div class="t-1"><table id="us_min" cellspacing="5" style=""></table></div> </div> <script type="text/javascript"> var lim = 25, //количество ячеек (персон) в таблице ktd = 5; //количество ячеек в строке </script> <script type="text/javascript" src="http://forumstatic.ru/files/0017/d8/50/88008.js"></script>