Главная » Файлы » Скрипты для uCoz » Комментарии

Стильная форма добавления комментариев by Apocalypse для uCoz
23.06.14, 09:05:37

Скачать файл




Данный вид комментариев сочетает в себя элегантный вид и технологию jQuery. Данный вид я разрабатывал специально для своего нового дизайна и теперь, думаю, пришло время поделиться и с остальными пользователями интернета smile

Установка:

В Форме добавления комментариев замените всё на:
Код
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tbody><tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/1.png" height="17">
</td>
<td background="http://apocalypse.ucoz.kz/border/2.png" height="17">
</td>
<td width="17" background="http://apocalypse.ucoz.kz/border/3.png" height="17">
</td>
</tr>
<tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/4.png">
</td>
<td>
  <?if($USER_LOGGED_IN$)?>  

  <center>  
  <table width="100%" cellpadding="0" cellspacing="0">  

  <td>  
  <textarea onmouseover="$('#subs').slideUp('slow');" onmousemove="$('#mainbtns').animate({width:'show'},500);" class="commFl" class="commFl" style="height:200px;" rows="8" name="message" id="message" cols="50" onKeyPress="if (event.keyCode==10 || (event.ctrlKey && event.keyCode==13)) {addcom();}">$MESSAGE$</textarea>  
  </td>  

  <div style="display:none;position:absolute;right:120;z-index:10;" id="mainbtns">  
  <a onclick="$('#smile').slideToggle('slow');" href="javascript://" title="Показать смайлы"><span><img src="http://apocalypse.ucoz.kz/images/main/smile.png" border="0" width="50"></span></a><br>  
  <a onclick="$('#bbcode').slideToggle('slow');" href="javascript://" title="Показать BB коды"><span><img src="http://apocalypse.ucoz.kz/images/main/bbcode.png" border="0" width="50"></span></a><br>  
  <a onclick="precomment()" title="Предварительный просмотр комментария"><span><img src="http://apocalypse.ucoz.kz/images/main/prew.png" border="0" width="50"></span></a><br>  
  <a onClick="javascript:byn=void(window.open('http://hosting.ucoz.kz','byn','toolbar=1,width=800,height=600,top=300,left=300'))" title="Быстро прикрепить файл или картинку"><span><img src="http://apocalypse.ucoz.kz/images/main/atach.png" border="0" width="50"></span></a><br>  
  </div>  

  </table>  

  </center>  

  <?else?>  
  <center><b><br>Извините, но гости не могут оставлять комментарии<br>Войдите на сайт под своим именем или пройдите быструю регистрацию</b><br><br></center>  
  <?endif?>  

  </td>
<td width="17" background="http://apocalypse.ucoz.kz/border/5.png">
</td>
</tr>
<tr>
<td width="17" background="http://apocalypse.ucoz.kz/border/6.png" height="17">
</td>
<td background="http://apocalypse.ucoz.kz/border/7.png" height="17">
</td>
<td width="17" background="http://apocalypse.ucoz.kz/border/8.png" height="17">
</td>
</tr>
</tbody></table>  

  <table width="100%" border="0" cellpadding="0" cellspacing="0">
  <td>  
  <div align="center" style="display:none;padding:2px;opacity:0.5" id="smile">  
  <script src="http://apocalypse.ucoz.kz/js/comments.js"></script>  
  </div>  
  <div align="center" style="display:none;padding:2px;opacity:0.5;" id="bbcode">  
  <script type='text/javascript' src='http://s15.ucoz.net/src/bbcodes.js'></script><span style="padding-right:1px;" id="bc1"><input type="button" title="Bold" value="b" onclick="simpletag('b','','','message','')" class="codeButtons" id="b" style="width:20px;font-weight:bold" /></span><span style="padding-right:1px;" id="bc2"><input type="button" title="Italic" value="i" onclick="simpletag('i','','','message','')" class="codeButtons" id="i" style="width:20px;font-style:italic" /></span><span style="padding-right:1px;" id="bc3"><input type="button" title="Underline" value="u" onclick="simpletag('u','','','message','')" class="codeButtons" id="u" style="width:20px;text-decoration:underline" /></span><span style="padding-right:1px;" id="bc4"><select id="fsize" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value,'size','message','');this.selectedIndex=0;"><option value='0'>SIZE</option><option value='6'>6 pt</option><option value='7'>7 pt</option><option value='8'>8 pt</option><option value='9'>9 pt</option><option value='10'>10 pt</option><option value='11'>11 pt</option><option value='12'>12 pt</option><option value='13'>13 pt</option><option value='14'>14 pt</option><option value='15'>15 pt</option><option value='16'>16 pt</option><option value='17'>17 pt</option><option value='18'>18 pt</option><option value='19'>19 pt</option><option value='20'>20 pt</option><option value='21'>21 pt</option><option value='22'>22 pt</option></select></span><span style="padding-right:1px;" id="bc5"><select id="ffont" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value,'font','message','');this.selectedIndex=0;"><option value='0'>FAMILY</option><option value='Arial'>Arial</option><option value='Times'>Times</option><option value='Courier'>Courier</option><option value='Impact'>Impact</option><option value='Geneva'>Geneva</option><option value='Optima'>Optima</option></select></span><span style="padding-right:1px;" id="bc6"><select id="fcolor" class="codeButtons" onchange="alterfont(this.options[this.selectedIndex].value, 'color','message','');this.selectedIndex=0;"><option value='0'>COLOR</option><option value='blue' style='color:blue'>Blue</option><option value='red' style='color:red'>Red</option><option value='purple' style='color:purple'>Purple</option><option value='orange' style='color:orange'>Orange</option><option value='yellow' style='color:yellow'>Yellow</option><option value='gray' style='color:gray'>Gray</option><option value='green' style='color:green'>Green</option></select></span><span style="padding-right:1px;" id="bc7"><input type="button" title="URL" value="http://" onclick="tag_url('message','')" class="codeButtons" style="direction:ltr;width:45px;" id="url" /></span><span style="padding-right:1px;" id="bc8"><input type="button" title="E-mail" value="@" onclick="tag_email('message','')" class="codeButtons" style="width:30px;" id="email" /></span><span style="padding-right:1px;" id="bc9"><input type="button" title="Image" value="img" onclick="tag_image('message','')" class="codeButtons" style="width:35px;" id="img" /></span><span style="padding-right:1px;" id="bc10"><input type="button" title="Quote" value="quote" onclick="simpletag('quote','','','message','')" class="codeButtons" style="width:40px;" id="quote" /></span><span style="padding-right:1px;" id="bc11"><input type="button" title="Code" value="code" onclick="simpletag('code','','','message','')" class="codeButtons" style="width:40px;" id="codes" /></span><span style="padding-right:1px;" id="bc34"><input type="button" title="Spoiler" value="spoiler" onclick="simpletag('spoiler','','','message','')" class="codeButtons" style="width:40px;" id="spoiler" /></span><span style="padding-right:1px;" id="bc18"><input type="button" title="Hide from Guest" value="hide" onclick="simpletag('hide','','','message','')" class="codeButtons" style="width:40px;" id="hide" /></span><span style="padding-right:1px;" id="bc12"><input type="button" title="List" value="list" onclick="tag_list('message','')" class="codeButtons" id="list" style="width:30px;" /></span><span style="padding-right:1px;" id="bc13"><input type="button" title="Left" style="width:20px;text-align:left;" value='···' onclick="simpletag('l','cdl','···','message')" class="codeButtons" id="cdl"></span><span style="padding-right:1px;" id="bc14"><input type="button" title="Center" style="width:20px;text-align:center;" value='···' onclick="simpletag('c','cdc','···','message')" class="codeButtons" id="cdc"></span><span style="padding-right:1px;" id="bc15"><input type="button" title="Right" style="width:20px;text-align:right;" value='···' onclick="simpletag('r','cdr','···','message')" class="codeButtons" id="cdr"></span><span style="padding-right:1px;" id="bc16"><input type="button" title="All codes" style="width:20px;" value="+" onclick="window.open('http://apocalypse.ucoz.kz/index/17','bbcodes','scrollbars=1,width=550,height=450,left=0,top=0');" class="codeButtons" /></span><span style="padding-right:1px;" id="bc17"><input style="font-weight:bold;width:20px" type="button" value="/" class="codeButtons" title="Close all opened codes" onclick="closeall('message','');" class="codeCloseAll" /></span>  
  </div>  
  </td></table>  

  <center>  
  <input style="height:22;opacity:0.5;" onmouseover="$('#subs').slideDown('slow');" type="submit" onClick="Down()" id="addcBut" name="submit" value="Добавить комментарий [ctrl + enter]">  
  <table>  
  <td class="commTd2">  
  $ERROR$  
  </td>  
  </table>  
  <div style="display:none;opacity:0.5;" id="subs">  
  <?if($SUBSCRIBE$)?><center>$SUBSCRIBE$</center><?endif?>  
  <?if($SECURITY_CODE$)?><center>$SECURITY_CODE$</center><?endif?>  
  </div>  
  </center>  

  <script type="text/javascript">
function precomment(){
document.preform.message.value=$('#message').val();
<?if($SMILES$)?>document.preform.sm.value='1';<?endif?>
window.open('','commprev','scrollbars=1,width=600,height=250,left=0,top=0');
document.preform.submit();}
</script>


С Формой добавления комментариев мы разобрались, осталось лишь активировать кнопку "Предпросмотр"

Бежим на страницу материала и комментариев к нему в тех модулях, где будут комментарии и находим там (В самом низу) следующий участок кода:
Код
$COM_ADD_FORM$


Сразу после этого вставляем:
Код
<form style="display: none;" method="post" name="preform" action="/forum/" target="commprev">
  <input name="message" type="hidden" />
  <input type="hidden" name="sm" value="0" />
  <input type="hidden" name="a" value="32" />
  </form>


На случай, если ссылки на файлы станут битыми, прикрепляю архив со всеми используемыми скриптами и картинками

В случае копирования данного материала прошу указывать источник: http://apocalypse.ucoz.kz и автора: Apocalypse

Материал подготовлен Apocalypse
Категория: Комментарии | Добавил: Apocalypse | Теги: форма, Apocalypse, ucoz, by, добавления, комментариев, стильная, для
Просмотров: 304 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: