[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Красивейший вид комментариев
DmitryProdДата: Воскресенье, 11.09.2011, 23:24 | Сообщение # 1
 Сообщений: 34
  Награды: 0
 Репутация: 2
 Замечания: ±
 
Offline


Вам надо только загрузить исходники в корень сайта: картинки в папку images, а js файлы соответственно в папку js. Ссылка на архив: Скачать

1) Убраны все подписи, что заметно сократило объём комментариев
2) При клике на иконку с листком и ручкой происходит цитирование пользователя
3) Все комментарии полупрозрачны. При наведении на каждый комментарий он плавно подсвечивается
4) При наведении на сообщение высвечивается дата его добавления.

Установка:

1) Для начала на страницах, где у Вас отображаются комментарии между <head> и </head> вставьте следующий код
(Отвечает за плавное изменение прозрачности):
Code
<!-- <COMMENTS> -->
<script src="/js/jquery.tooltip.js" type="text/javascript"></script>   
     
<script src="/js/opacity.js"></script>   
<script type="text/javascript">   
fadeOpacity.addRule('oR1', .5, 1, 50);   
</script>
<!-- </COMMENTS> -->


2) В Виде комментариев замените весь код на:
Code
<!-- <COMMENTS> -->
<table style="opacity: 0.5;" id="fImga$ID$" onmouseover="fadeOpacity(this.id, 'oR1')" onmouseout="fadeOpacity.back(this.id)" border="0" cellpadding="0" cellspacing="0" width="100%">   
<tr><td width="20%">   

<table border="0" cellpadding="0" cellspacing="0">   
   <tbody><tr>   
   <td width="17" background="/images/1.png" height="17">   
   </td>   
   <td background="/images/2.png" height="17">   
   </td>   
   <td width="17" background="/images/3.png" height="17">   
   </td>   
   </tr>   
   <tr>   
   <td width="17" background="/images/4.png">   
   </td>   
   <td>   

<?if($USER_AVATAR_URL$)?><a title="Просмотреть профиль $USERNAME$" href="$PROFILE_URL$" target="blank"><img src="$USER_AVATAR_URL$" width="60px" border="0"></a><?else?><a title="$USERNAME$" href="$PROFILE_URL$"><img title="Просмотреть профиль $USERNAME$" src="/images/noavatar.png" width="60px"></a><?endif?>   

</td>   
   <td width="17" background="/images/5.png">   
   </td>   
   </tr>   
   <tr>   
   <td width="17" background="/images/6.png" height="17">   
   </td>   
   <td background="/images/7.png" height="17">   
   </td>   
   <td width="17" background="/images/8.png" height="17">   
   </td>   
   </tr>   
   </tbody></table>   
</td><td width="80%" align="right">   

<table border="0" cellpadding="0" cellspacing="0" width="100%">   
   <tbody><tr>   
   <td width="17" background="/images/1.png" height="17">   
   </td>   
   <td background="/images/2.png" height="17">   
   </td>   
   <td width="17" background="/images/3.png" height="17">   
   </td>   
   </tr>   
   <tr>   
   <td width="17" background="/images/4.png">   
   </td>   
   <td>   

<table border="0" cellpadding="0" cellspacing="0" width="100%">   
<tr><td width="6%">   
<font color="000000"><img title="Клик для цитирования $USERNAME$" href="javascript://" rel="nofollow" onclick="emoticon('[color=yellow]$USERNAME$[/color], ','message');return false;" src="/images/commentquote.png" border="0" width="60"></td><td width="94%"><div title="Добавлен: $DATE$, $TIME$">$MESSAGE$</div></font><span style="float:right;font-size:11px;font-family:Segoe UI,arial,sans-serif;">$MODER_PANEL$</span></td></tr></table>   

</td>   
   <td width="17" background="/images/5.png">   
   </td>   
   </tr>   
   <tr>   
   <td width="17" background="/images/6.png" height="17">   
   </td>   
   <td background="/images/7.png" height="17">   
   </td>   
   <td width="17" background="/images/8.png" height="17">   
   </td>   
   </tr>   
   </tbody></table>   

</td></tr></table>
<!-- </COMMENTS> -->


Если я Вам помог, поставьте мне + в качестве благодарности. smile


  • Страница 1 из 1
  • 1
Поиск: