Здравствуйте. Хотел из стандартного шаблона Gemeni взять кнопку с датой и информацией к новости и вставить свой шаблон. Вот эта кнопка:
В shortstory я вставляю:
В css:
В js:
Но кнопка отображается некорректно:
Что я делаю не правильно?
В shortstory я вставляю:
HTML:
<script type="text/javascript">//<![CDATA[
$(function(){ $("#infb{news-id}").Button("#infc{news-id}"); });
//]]></script>
<div class="infbtn">
<span id="infb{news-id}" class="thide" title="Информация к новости">Информация к новости</span>
<div id="infc{news-id}" class="infcont">
<ul>
<li><i>Просмотров: {views}</i></li>
<li><i>Автор: {author}</i></li>
<li><i>Дата: {date}</i></li>
</ul>
[edit-date]<div class="editdate"><i>Изменил: <b>{editor}</b>[edit-reason]<br />Причина: {edit-reason}[/edit-reason]</i></div>[/edit-date]
[rating]
[rating-type-1]<div class="ratebox"><div class="rate">{rating}</div></div>[/rating-type-1]
[rating-type-2]<div class="ratebox2">
<ul class="reset">
<li>[rating-plus]<img src="{THEME}/images/like.png" title="Нравится" alt="Нравится" style="width:14px;" />[/rating-plus]</li>
<li>{rating}</li>
</ul></div>[/rating-type-2]
[rating-type-3]<div class="ratebox3">
<ul class="reset">
<li>[rating-minus]<img src="{THEME}/images/ratingminus.png" title="Не нравится" alt="Не нравится" style="width:14px;" />[/rating-minus]</li>
<li>{rating}</li>
<li>[rating-plus]<img src="{THEME}/images/ratingplus.png" title="Нравится" alt="Нравится" style="width:14px;" />[/rating-plus]</li>
</ul>
</div>[/rating-type-3]
[/rating]
</div>
</div>
Код:
.infbtn {
margin: 3px 0 0 1px;
float: right;
position: relative;
width: 22px;
height: 22px;
}
.infbtn .thide {
cursor: pointer;
background: #db143d url("../images/boxinfo.png");
padding-top: 22px;
width: 22px;
}
.infbtn .thide:hover {
background-position: 0 -44px;
}
.infbtn .thide.selected {
background-position: 0 -22px;
background-color: #c0cad2;
}
.infcont {
z-index: 33;
width: 180px;
background-color: #dfe3e6;
border: 2px solid #a6b5c0;
position: absolute;
top: 23px;
right: 0;
display: none;
}
.infcont ul {
position: relative;
list-style: none;
font-size: 0.9em;
color: #67747b;
margin: 0 6px;
padding: 5px 0;
}
В js:
Код:
$.fn.Button=function(sel)
{
var closed=true,
th=this;
$(sel).hide();
$(this).removeClass('selected').click(function(){
$(sel).toggle("fast");
$(this).toggleClass("selected");
closed=!closed;
return false;
});
$(document).click(function(e){
if(closed)
return;
var target=e.target||e.srcElement;
while(target)
{
var ret=false;
$(sel).each(function(){
if(ret=target==this)
return false;
});
if(ret)
return;
target=target.parentNode;
}
$(sel).hide('fast');
$(th).removeClass('selected');
closed=true;
});
return this;
}
Но кнопка отображается некорректно:
Что я делаю не правильно?