Код
<script>
function FClick() {
$("#fff16871").animate({"left": "+=25px"}, "slow");
$('#mess').html($('#f').html())
$('#mess').hide().fadeIn(1000);
$('#foto').html($('#kf').html())
$('#foto').hide().fadeIn(1000);
$('#cler').hide().fadeIn(1000);
$('#asd').addClass('summary');
$("#fff16871").animate({"left": "-=25px"}, "slow");
}
function F2Click() {
$("#fff16871").animate({"left": "+=25px"}, "slow");
$('#mess').html($('#f2').html())
$('#mess').hide().fadeIn(1000);
$('#foto').html($('#kf2').html())
$('#foto').hide().fadeIn(1000);
$('#cler').hide().fadeIn(1000);
$('#asd').addClass('summary');
$("#fff16871").animate({"left": "-=25px"}, "slow");
}
function F3Click() {
$("#fff16871").animate({"left": "+=25px"}, "slow");
$('#mess').html($('#f3').html())
$('#mess').hide().fadeIn(1000);
$('#foto').html($('#kf3').html())
$('#foto').hide().fadeIn(1000);
$('#cler').hide().fadeIn(1000);
$('#asd').addClass('summary');
$("#fff16871").animate({"left": "-=25px"}, "slow");
}
function F4Click() {
$("#fff16871").animate({"left": "+=25px"}, "slow");
$('#mess').html($('#f4').html())
$('#mess').hide().fadeIn(1000);
$('#foto').html($('#kf4').html())
$('#foto').hide().fadeIn(1000);
$('#cler').hide().fadeIn(1000);
$('#asd').addClass('summary');
$("#fff16871").animate({"left": "-=25px"}, "slow");
}
function F5Click() {
$("#fff16871").animate({"left": "+=25px"}, "slow");
$('#mess').html($('#f5').html())
$('#mess').hide().fadeIn(1000);
$('#foto').html($('#kf5').html())
$('#foto').hide().fadeIn(1000);
$('#cler').hide().fadeIn(1000);
$('#asd').addClass('summary');
$("#fff16871").animate({"left": "-=25px"}, "slow");
}
function CloClick() {
$('#ff16871').slideToggle(300);$('#fff16871').delay(400).slideToggle(300);
}
function clerClick() {
$('#mess').fadeOut("slow")
$('#cler').fadeOut("slow")
$('#foto').fadeOut("slow")
$('#asd').removeClass('summary');
}
</script>
<style>
#f, #f2, #f3, #f4, #f5, #f6 { display:none; }
#kf, #kf2, #kf3, #kf4, #kf5, #kf6 { display:none; }
.zag { color:green; cursor:pointer;}
.summary {border-right:2px solid #F00; }
</style>
<table id="fff16871" style="border-radius: 25em 0.5em/1em 1em;position:fixed; top:5px; left:5px; z-index:99999998; background:rgba(25, 25, 25, 0.9); padding:25px; padding-right:10px !important; font-size:12px; font-family:arial; font-weight:bold; box-shadow:0px 2px 6px #252525;;height: auto; width: auto; max-width: 80%; max-height: 35%;">
<td align="right" width="150px" id="asd">
<!--Новость1-->
<span class="zag" onclick="FClick();">ЗАГОЛОВОК1</span>
<div id="kf">
<img title="Тут картинка новости" src="http://stalker.ucoz.ae/1/429752_366.png">
</div>
<div id="f">
Текст уоторый будет показыватся при клике на "ЗАГОЛОВОК1".Html Потдерживается. <a href="http://stalker.ucoz.ae/">к примеру ссылка</a>.
</div>
<!--/Новость1-->
<!--Новость2-->
<span class="zag" onclick="F2Click();">ЗАГОЛОВОК2</span>
<div id="kf2">
<img title="Тут картинка новости" src="http://stalker.ucoz.ae/1/429752_366.png">
</div>
<div id="f2">
Текст уоторый будет показыватся при клике на "ЗАГОЛОВОК2".Html Потдерживается. <a href="http://stalker.ucoz.ae/">к примеру ссылка</a>.
</div>
<!--/Новость2-->
<!--Новость3-->
<span class="zag" onclick="F3Click();">ЗАГОЛОВОК3</span>
<div id="kf3">
<img title="Тут картинка новости" src="http://stalker.ucoz.ae/1/429752_366.png">
</div>
<div id="f3">
Текст уоторый будет показыватся при клике на "ЗАГОЛОВОК3".Html Потдерживается. <a href="http://stalker.ucoz.ae/">к примеру ссылка</a>.
</div>
<!--/Новость3-->
<!--Новость4-->
<span class="zag" onclick="F4Click();">ЗАГОЛОВОК4</span><br>
<div id="kf4">
<img title="Тут картинка новости" src="http://stalker.ucoz.ae/1/429752_366.png">
</div>
<div id="f4">
Текст уоторый будет показыватся при клике на "ЗАГОЛОВОК4".Html Потдерживается. <a href="http://stalker.ucoz.ae/">к примеру ссылка</a>.
</div>
<!--/Новость4-->
<hr style=" border-top: 1px solid #333;border-bottom: 1px solid #111;box-shadow:0px 2px 6px #444;">
<!--Профиль-->
<span class="zag" onclick="F5Click();">Профиль</span>
<div id="kf5">
<?if($USER_AVATAR_URL$)?><img title="Ваш аватар" src="$USER_AVATAR_URL$"><?else?><a class="zag">Нет аватара</a><?endif?>
</div>
<div id="f5">
<?ifnot($USER_LOGGED_IN$)?>
<a href="$LOGIN_LINK$">-==Вход на сайт==-</a><br>
<?else?>
<div><a href="$PM_URL$">Личные сообщения [$UNREAD_PM$]</a>|*|
<a href="/index/11">Редактирование данных</a></div>
Здравствуйте, <a style="color:#FFCC33">$USERNAME$</a><br>
Сколько дней вы на сайте: <a style="color:#FFCC33">$USER_REG_DAYS$</a><br>
Вы в группе: <a style="color:#FFCC33">$USER_GROUP$</a><br>
Ваш браузер: <a style="color:#FFCC33">$USER_AGENT$ $USER_AGENT_VER$</a><br>
Ваш IP: <a style="color:#FFCC33">$IP_ADDRESS$</a><br>
Ваш ID: <a style="color:#FFCC33">$USER_ID$</a>
<div align="right"><a href=$LOGOUT_LINK$ style="color:red; box-shadow:0px 2px 6px #777777;">Выход</a></div>
<?endif?>
</div>
<!--/Профиль-->
</td>
<td>
<div id="mess" style="color:#FF6633;box-shadow:0px 2px 6px #777777;"></div>
</td>
<td>
<div id="foto" style="color:#FF6633;box-shadow:0px 2px 6px #777777; display:none"></div>
</td>
<td align="right" ><span id="cler" style="color:#FF0000; cursor:pointer; font-size:16px; display:none" onclick="clerClick();">|«</span></td>
</table>
<span style="cursor:pointer;position:fixed; top:5px; left:5px; z-index:99999998; color:#00FF00;opacity: 0.5;" onclick="CloClick();" id="clo">
«»<br>
«»
«»<be>
</span>
){kind=link}