Автор: rps
Честно говоря, штука очень удобная как для постов, таки для флуда. Чтобы увидеть ее действие, если вы гость - посмотрите в гостевом разделе в посте или здесь, на скрине (скрин предоставлен нашим форумом):
ХТМЛ верх
Код:
<script type="text/javascript"> FORUM.set('editor.think', { name : 'Добавить мысли', onclick : function() {make_code(); } } ); </script> <style type="text/css"> td#button-think { background: url(http://st1.bbcorp.ru/i/information.png) no-repeat center !important; } #think-area { position: absolute; z-index: 1000; top: 43px; right: 15px; padding: 1.5em; width: 500px; } #div_smiles p { padding-bottom: 0 !important; } #div_smiles span { display: inline; } .think_table { width: auto !important; table-layout: auto !important; } td.think_td { margin: 0; padding: 0.2em !important; border-style: none !important; } .think_content { background-color: #eeee6f; color: #000; border-radius: 16px; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -o-border-radius: 16px; border: 1px solid #fff; padding: 3px 5px !important; font-size: 1em; } #textarea, #input { width: 100%; } #close_button { margin-left: 15px; } .standart_smile { padding: 2px; cursor: pointer; } #hidden_link { text-decoration: none; border-bottom: 1px dotted; } .thought { padding-right: 7px; background: transparent url(http://s1.uploads.ru/i/D6VpZ.png) no-repeat top right; display: inline-block; } </style>
ХТМЛ низ
Код:
<script type="text/javascript"> var div; var i = 0; var t; var inp; var ta; var max = 10; var def_text = "Мысль потерялась..."; var def_smile = "http://s1.uploads.ru/i/t2jJV.gif"; var pic = new Array(); pic.push("http://www.kolobok.us/smiles/standart/acute.gif"); pic.push("http://www.kolobok.us/smiles/standart/ireful3.gif"); pic.push("http://www.kolobok.us/smiles/standart/blum2.gif"); pic.push("http://www.kolobok.us/smiles/standart/black_eye.gif"); pic.push("http://www.kolobok.us/smiles/standart/bad.gif"); pic.push("http://www.kolobok.us/smiles/standart/secret.gif"); pic.push("http://www.kolobok.us/smiles/standart/yahoo.gif"); pic.push("http://www.kolobok.us/smiles/standart/whistle2.gif"); pic.push("http://www.kolobok.us/smiles/standart/facepalm.gif"); pic.push("http://www.kolobok.us/smiles/standart/this.gif"); pic.push("http://www.kolobok.us/smiles/standart/agree.gif"); pic.push("http://www.kolobok.us/smiles/standart/black_eye.gif"); pic.push("http://www.kolobok.us/smiles/standart/grin.gif"); pic.push("http://www.kolobok.us/smiles/standart/help.gif"); pic.push("http://www.kolobok.us/smiles/standart/polling.gif"); pic.push("http://www.kolobok.us/smiles/standart/smoke.gif"); pic.push("http://www.kolobok.us/smiles/standart/sorry2.gif"); pic.push("http://www.kolobok.us/smiles/standart/umnik.gif"); pic.push("http://www.kolobok.us/smiles/standart/yu.gif"); pic.push("http://www.kolobok.us/smiles/standart/drinks.gif"); function make_div() { var fs; var z = 0; var new_div; fs = document.getElementsByTagName("div"); for (z in fs) { if (fs[z].className == "fs-box hashelp") { new_div = document.createElement("div"); new_div.id = "think-area"; new_div.className = "container"; new_div.style.display = "none"; fs[z].appendChild(new_div); } } } function make_think(x) { var reg; var think; var j = 0; res = x.innerHTML; var smile; var text; reg = new RegExp("\\[think=([^\\]]+)\\]([^\\[\\]]+)\\[/think\\]", "g"); if (reg.test(res)) { think = res.match(reg); for (j in think) { smile = think[j].substring(think[j].indexOf('[think=') + 7, think[j].indexOf(']')); text = think[j].substring(think[j].indexOf(']') + 1, think[j].indexOf('[/think]')); res = res.replace('[think=' + smile + ']' + text + '[/think]', '<table class="think_table" cellpadding="0" cellspacing="0"><tr><td class="think_td"><div class="think_content">' + text + '</div><span class="thought"><img src="' + smile + '" alt="" /></span></td></tr></table>'); } } return res; } function make_bb_code() { t = document.getElementById("textarea").value; if (t == "") t = def_text; inp = document.getElementById("input").value; if (inp.indexOf("http://") == -1) inp = def_smile; bbcode('[think=' + inp + ']' + t + '','[/think]'); changeVisibility('think-area'); } function make_code() { var h = 0; changeVisibility('think-area'); ta = document.getElementById("think-area"); ta.innerHTML = "<textarea id='textarea' rows='5'>Введите текст мысли</textarea>"; ta.innerHTML += "<div id='div_smiles'><p id='conteiner_smiles'><span id='visible_smiles'></span><span id='hidden_smiles' style='display: none;'></span></p><a id='hidden_link' style='cursor: pointer;' title='Показать или скрыть эмоции' onclick='document.getElementById(\"hidden_smiles\").style.display = (document.getElementById(\"hidden_smiles\").style.display == \"none\" ? \"inline\" : \"none\");'>Больше эмоций</a></div><br />"; ta.innerHTML += "<input type='text' id='input' value='Вставьте ссылку на смайл' /><br /><br />"; for (h in pic) { if (h < max) document.getElementById("visible_smiles").innerHTML += "<img class='standart_smile' src='" + pic[h] + "' alt='Эмоции' title='Нажмите, чтобы добавить' onclick='document.getElementById(\"input\").value = this.src;' />"; else document.getElementById("hidden_smiles").innerHTML += "<img class='standart_smile' src='" + pic[h] + "' alt='Эмоции' title='Нажмите, чтобы добавить' onclick='document.getElementById(\"input\").value = this.src;' />"; } ta.innerHTML += "<input type='button' class='button' value='Добавить' id='bb_buton' onclick='make_bb_code();' />"; ta.innerHTML += "<input type='button' class='button' value='Закрыть' id='close_button' onclick='changeVisibility(\"think-area\");' />"; } make_div(); div = document.getElementById("pun-main").getElementsByTagName("div"); for (i in div) { if (div[i].className == "post-content") div[i].innerHTML = make_think(div[i]); } </script>
Чтобы изменить/добавить смайл, вставляем после последнего смайла этот код:
Код:
pic.push("ссылка_на_смайл");