NK-uCoz.Ru » Каталог файлов » uCoz » Авторство NK-uCoz.Ru » Форма добавления комментариев как на DLE

Форма добавления комментариев как на DLE

Форма добавления комментариев как на DLE
Авторство NK-uCoz.Ru
na3uTuB4uk
19.11.14, 13:20
1274
1
Установка:

1. В форму добавления комментариев заменяем код на этот:
Код
<div class="base">
<div class="static_c">
<div class="tableform" id="blocksize">
<div style="display:none;">$BBCODES$</div>

<?if($ERROR$)?><div class="commError" id="eMessage" align="center">$ERROR$</div><?endif?>

<dl>
<dd class="editorcomm">
<div class="bb-editor">
<?if($BBCODES$)?>
<div class="bb-pane">
<span id="b_b" class="bb-btn" href="javascript:if;;" onclick="simpletag('b','','','message','')" title="Полужирный"><b>Полужирный</b></span>
<span id="b_i" class="bb-btn" href="javascript:if;;" onclick="simpletag('i','','','message','')" title="Наклонный текст"><b>Наклонный текст</b></span>
<span id="b_u" class="bb-btn" href="javascript:if;;" onclick="simpletag('u','','','message','')" title="Подчеркнутый текст"><b>Подчеркнутый текст</b></span>
<span id="b_url" class="bb-btn" href="javascript:if;;" onclick="tag_url('message','')" title="Вставка ссылки"><b>Вставка ссылки</b></span>
<span id="b_emo" class="bb-btn" title="Вставка смайликов" onclick="new _uWnd('Sml',' ',-250,-350,{autosize:0,closeonesc:1,resize:0},{url:'/index/35-1-'});" href="#"><b>Вставка смайликов</b></span>
<span id="b_hide" class="bb-btn" href="javascript:if;;" onclick="simpletag('hide','','','message','')" title="Скрытый текст"><b>Скрытый текст</b></span>
<span id="b_left" class="bb-btn" href="javascript:if;;" onclick="simpletag('l','','','message','')" title="Выравнивание по левому краю"><b>Выравнивание по левому краю</b></span>
<span id="b_center" class="bb-btn" href="javascript:if;;" onclick="simpletag('c','','','message','')" title="По центру"><b>По центру</b></span>
<span id="b_right" class="bb-btn" href="javascript:if;;" onclick="simpletag('r','','','message','')" title="Выравнивание по правому краю"><b>Выравнивание по правому краю</b></span>
</div>
<?endif?>

<div class="bb_area">
<textarea name="message" id="message" cols="70" rows="10">$MESSAGE$</textarea>
</div>

</div>
</dd></dl>
</div>

<div align="center"><br>
<input class="f_button" id="addcBut" name="submit" value="Добавить" type="submit">
</div>

<div class="clr"></div>
</div></div>

2. В CSS добавим:
Код
/* бб панель */  
.bb-editor{-webkit-box-shadow:inset 0px 0px 0px 1px #eef0f0,0px 0px 0px 3px #f8fbfb; -moz-box-shadow:inset 0px 0px 0px 1px #eef0f0,0px 0px 0px 3px #f8fbfb; box-shadow:inset 0px 0px 0px 1px #eef0f0,0px 0px 0px 3px #f8fbfb; background:#fff; padding:1px 0;}  
.bb-pane{background:#ffffff;  
  /* Old browsers */  
  background:-moz-linear-gradient(top,#ffffff 0%,#f7f8fc 100%);  
  /* FF3.6+ */  
  background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#ffffff),color-stop(100%,#f7f8fc));  
  /* Chrome, Safari4+ */  
  background:-webkit-linear-gradient(top,#ffffff 0%,#f7f8fc 100%);  
  /* Chrome10+, Safari5.1+ */  
  background:-o-linear-gradient(top,#ffffff 0%,#f7f8fc 100%);  
  /* Opera 11.10+ */  
  background:-ms-linear-gradient(top,#ffffff 0%,#f7f8fc 100%);  
  /* IE10+ */  
  background:linear-gradient(to bottom,#ffffff 0%,#f7f8fc 100%);  
  /* W3C */  
  filter:progid:dximagetransform.microsoft.gradient( startcolorstr='#ffffff',endcolorstr='#f7f8fc',gradienttype=0 );  
  /* IE6-9 */  
  border-bottom:1px solid #eef0f0; height:31px; margin:0 1px; position:relative;}  
  .bb-sel{float:left; padding:4px 2px 0 2px; }  
  .bb-sel select{font-size:11px; }  
  .bb-btn{background:url("../images/bbcodes/sep.png") no-repeat right 0; width:28px; padding:0 1px 0 0; height:31px; float:left; display:block; overflow:hidden; text-indent:-9999px; white-space:nowrap; cursor:pointer; box-shadow:none;}  
  .bb-btn:hover{background-color:rgba(241,245,250,1); padding:0; margin:0 1px 0 0;}  
  .bb-btn b{height:30px; width:26px; background:url("../images/bbcodes/bbcodes.png") no-repeat; display:block; text-indent:-9999px;}  
  .bb-btn b:hover{}  
  #b_font{width:118px;}  
  #b_size{width:65px;}  
  #b_font select{padding:0px;}  
  #b_size select{padding:0px;}  
  #b_b b,.b_b b{background-position:0 0;}  
  #b_i b,.b_i b{background-position:-28px 0;}  
  #b_u b,.b_u b{background-position:-56px 0;}  
  #b_s b,.b_s b{background-position:-84px 0;}  
  #b_img b,.b_img b{background-position:-308px 0;}  
  #b_up b{background-position:-56px -35px;}  
  #b_emo b,.b_emo b{background-position:-224px 0;}  
  #b_url b,.b_url b{background-position:-252px 0;}  
  #b_leech b,.b_leech b{background-position:-280px 0;}  
  #b_mail b{background-position:-84px -35px;}  
  #b_video b{background-position:-112px -35px;}  
  #b_audio b{background-position:-140px -35px;}  
  #b_hide b{background-position:-336px 0;}  
  #b_quote b,.b_quote b{background-position:-364px 0;}  
  #b_code b{background-position:-168px -35px;}  
  #b_left b{background-position:-112px 0;}  
  #b_center b{background-position:-140px 0;}  
  #b_right b{background-position:-168px 0;}  
  #b_color b,.b_color b{background-position:-196px 0;}  
  #b_spoiler b{background-position:-28px -35px;}  
  #b_fla b{background-position:-280px -35px;}  
  #b_yt b{background-position:-252px -35px;}  
  #b_tf b{background-position:-308px -35px;}  
  #b_list b{background-position:-336px -35px;}  
  #b_ol b{background-position:-364px -35px;}  
  #b_tnl b{background-position:0 -35px;}  
  #b_br b{background-position:-196px -35px;}  
  #b_pl b{background-position:-224px -35px;}  
  .bb-editor textarea{-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; padding:2px; width:100%; color:#adadad;}  
  .bb_area{padding:0; }  
  .lc_textarea textarea{background:url('../images/bbcodes/cloud.png') no-repeat scroll center center transparent !important; height:112px; }  
  .lc_textarea textarea{box-sizing:border-box;padding:2px;width:100%;color:#adadad;/*box-shadow:0px 1px 4px 0px rgba(238,240,240,0.58) inset;*/}  
  .f_button {  
padding: 5px 22px;  
border: none;  
border-bottom: 1px solid #179315;  
background-color: #23a720;  
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#aee218), to(#23a720));  
background-image: -webkit-linear-gradient(top, #aee218, #23a720);  
background-image: -o-linear-gradient(top, #aee218, #23a720);  
background-image: linear-gradient(to bottom, #aee218, #23a720);  
background-repeat: repeat-x;  
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.25);  
box-shadow: 0 1px 3px rgba(0,0,0,.25);  
-webkit-border-radius: 18px;  
border-radius: 18px;  
color: #fff;  
font-size: 1em;  
text-shadow: 0 -1px 0 #42b51e;  
margin-left: 4px;  
font-weight: bold;  
  }  
  .f_button:hover {  
background-position: 0 -10px;  
  }


3. Залить папку images/bbcodes к себе на сайт
1568_images.rar [12.6 Kb] (Скачали 26)
Ctrl
Enter
Заметили ошЫбку
Выделите текст и нажмите Ctrl+Enter
Вернуться назад
Комментарии (1)
ninja
ninja 21.11.14, 05:31
Супер, спасибо огромное ! Возьму себе!
1