Удобный поиск по форуму с маркированием найденного контекста

http://forumfiles.ru/uploads/0007/e3/f7/2617/t23020.png http://forumfiles.ru/uploads/0007/e3/f7/2617/t608996.png http://forumfiles.ru/uploads/0007/e3/f7/2617/t210416.png

Автор: Deff
Платформа: MyBB

За инициацию идеи скрипта, - хочу выразить признательность Romych и Домовому! (c) Deff

Ставим код по возможности ближе к Началу HTML низ
Первые два Варианта различаются только по цвету
Последний - для резиновых форумов, с шапкой-картинкой
( для шапки установленной фоном в #pun-title table подойдут и первые два:)

Для Первого Скриншота:

Код:
<!--Поиск-->
<style>
.splContR {
z-index:-1;
width:255px!important; /*ширина окна*/
height:auto; /*высота окна*/
border-radius: 22px;
background: rgba(250,214,165,.8);,.8);
background-clip: padding-box;
box-shadow: 3px 0 15px #D48D00 inset,-5px 4px 10px #D48D00!important;
top:-6px; /*отступ окна от верха кнопки*/
right:-7px; /*отступ окна от правого края монитора*/
padding:12px 40px 12px 21px!important;
color:#55271A; /*цвет шрифта*/
font: normal normal 400 12px/normal Georgia;
font-family:Georgia; /*шрифт*/
}
.splLinkR {
 cursor:pointer;
}
.post-content span.mark{
 background-color:#FFFE00;
}
</style>

<div  id="seaDrom" style="position:fixed;right:8px;top:100px;z-index:100">
<img class=splLinkR title="Искать!" src="http://s6.uploads.ru/tCs8Q.png" width="38" border="0" onclick="PanelToggleR5($('form.splContR'))"/>
<form class=splContR data="0" style="position:absolute;margin-right:-360px"  id="punbbsearch"  method="get" action="/search.php">
<input type="hidden" name="action" value="search">
<input type="text" id="fld1s" name="keywords" size="30" placeholder=" Поиск по форуму " maxlength="100" oninput="$('form.splContR').addClass('active')" style="min-width:222px;margin-left:13px;padding:4px; box-shadow: -1px 1px 4px #D48D00 inset;">
</form></div>
<script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/88155.js"></script>

Для Второго Скриншота:

Код:
<!--Поиск-->
<style>
.splContR {
z-index:-1;
width:255px!important; /*ширина окна*/
height:auto; /*высота окна*/
border-radius: 22px;
background: rgba(178,205,229,.8);
background-clip: padding-box;
box-shadow: 7px 0 15px #2B6D9F inset,-4px 4px 10px #7E7C76!important;
top:-6px; /*отступ окна от верха кнопки*/
right:-7px; /*отступ окна от правого края монитора*/
padding:12px 40px 12px 21px!important;
color:#55271A; /*цвет шрифта*/
font: normal normal 400 12px/normal Georgia;
font-family:Georgia; /*шрифт*/
}
.splLinkR {
 cursor:pointer;
}
.post-content span.mark{
 background-color:#FFFE00;
}
</style>

<div  id="seaDrom" style="position:fixed;right:8px;top:100px;z-index:100">
<img class=splLinkR title="Искать!" src="http://s6.uploads.ru/tCs8Q.png" width="38" border="0" onclick="PanelToggleR5($('form.splContR'))"/>
<form class=splContR data="0" style="position:absolute;margin-right:-360px"  id="punbbsearch"  method="get" action="/search.php">
<input type="hidden" name="action" value="search">
<input type="text" id="fld1s" name="keywords" size="30" placeholder=" Поиск по форуму " maxlength="100" oninput="$('form.splContR').addClass('active')" style="min-width:222px;margin-left:13px;padding:4px; box-shadow: -1px 1px 3px #2B6D9F inset;">
</form></div>
<script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/88155.js"></script>

Для Последнего:

Код:
<!--Поиск-->
<style>
.splContR {
z-index:-1;
width:250px!important; /*ширина окна*/
height:auto; /*высота окна*/
border-radius: 22px;

background: rgba(173,170,170,.961);
box-shadow: 1px 0 15px #000000 inset,4px 4px 10px #3F403D!important;
top:-5px; /*отступ окна от верха кнопки*/
right:-7px; /*отступ окна от правого края монитора*/
padding:12px 40px 12px 15px!important;
color:#55271A; /*цвет шрифта*/
font: normal normal 400 12px/normal Georgia;
font-family:Georgia; /*шрифт*/
}
.splLinkR {
 cursor:pointer;
}
.post-content span.mark{
 background-color:#FFFE00;
 color:#000;
}
</style>

<div id="seaDrom" style="position:fixed;right:8px;top:34.77%;z-index:100">
<img class=splLinkR title="Искать!" src="http://s6.uploads.ru/tCs8Q.png" width="35" border="0" onclick="PanelToggleR5($('form.splContR'))"/>
<form class=splContR data="0" style="position:absolute;margin-right:-360px"  id="punbbsearch"  method="get" action="/search.php">
<input type="hidden" name="action" value="search">
<input type="text" id="fld1s" name="keywords" size="30" placeholder=" Поиск по форуму " maxlength="100" oninput="$('form.splContR').addClass('active')" style="min-width:222px;margin-left:13px;padding:4px; box-shadow: -1px 1px 4px #222 inset;background:#EDEDED;color:#000!important;">
</form></div>
<script type="text/javascript" src="https://forumstatic.ru/files/0010/b4/f8/88155.js"></script>

Смещение по высоте регулируется в данном элементе(см. код):

<div  id="seaDrom" style="position:fixed;right:8px;top:100px;z-index:100">

При большом отступе от верха - смещение лучше устанавливать в % (Дабы не улетело за экран при мелких мониках)
Скрипт обезвреживания BB-кодов в блоке код (если он у Вас есть в наличии) должен стоять ниже данного скрипта по уровню в данном окне (HTML низ) настроек.