Статистика Форума
Последние обновленные темы
Самые популярные темы
Активисты форума
Авторитеты форума
Bioshock 2

Ответил: WurDalaK
Mass Effect

Ответил: greendayone82
Dead Space

Ответил: greendayone82
Беседы у костра

Создал: WurDalaK; ответов: 2105
Вопросы по модострою

Создал: WurDalaK; ответов: 1161
Ходка №1

Создал: Алеся; ответов: 301
Какой трек у вас сейчас и...

Создал: Never; ответов: 65
Злой админ

Создал: WurDalaK; ответов: 54
WurDalaK

Постов: 2057
Возрожденный

Постов: 1621
Wo1fRam

Постов: 592
Алеся

Постов: 183
Marsel

Постов: 174
WurDalaK

Уважение: 28
Venus

Уважение: 23
Never

Уважение: 17
Возрожденный

Уважение: 13
Wo1fRam

Уважение: 13

  • Страница 1 из 1
  • 1
Модератор форума: XemorDio  
Форум » Веб-мастерская » Скрипты » Блок с новостями + мини - профиль
Блок с новостями + мини - профиль
  XemorDio
Дата: Четверг, 03.04.2014, 15:21 | Сообщение # 1
Статус
Отмычка
Группа Сталкер
Сообщений 85
Награды 0
Замечания 0%
-
7
+


Данный скрипт будет выводить в верхнем левом углу блок, в котором будут содержаться четыре новости и мини профиль. Можно добавить свои пункты при соответствующих знаниях

Особенности:

лёгкая установка.
Пользователь может скрыть панель, если она ему мешает.
Интересный Дизайн, Который подойдёт почти для любого сайта.

Минусы:

Если блок мешается пользователю, ему придётся каждый раз после перезагрузки страницы его закрывать.
Заголовки, текст и картинку новостей придётся менять вручную

Установка:

В любой глобальный блок:
Код
<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>


Все Новости разделены комментариями. К примеру, первая новость начинается так: а заканчивается так:

1 - это номер новости

Между этими комментариями редактируются Заголовок новости, Картинка новости и Текст новости

Разберем к примеру код одной из новостей:

ЗАГОЛОВОК1

"Тут картинка новости" "http://stalker.ucoz.ae/1/429752_366.png">

Текст уоторый будет показыватся при клике на "ЗАГОЛОВОК1".Html Потдерживается. к примеру ссылка.
 
  WurDalaK
Дата: Четверг, 03.04.2014, 17:22 | Сообщение # 2
Mysterious asari
Статус
Страж
Группа Администраторы
Сообщений 2057
Награды 9
-
28
+
Закинь все что между скобками <> в тег code, иначе это не будет отображаться)

Хочешь сказать спасибо? Ставь + в репутацию!
Спрятать подпись Спрятать все подписи
 
Форум » Веб-мастерская » Скрипты » Блок с новостями + мини - профиль
  • Страница 1 из 1
  • 1
Поиск:
Мини-чат
Яндекс.Метрика