Фиксированная чёрная полоса внизу экрана, при прокрутке становится полупрозрачной. При наведении мышки на полосу - становится активной.

Между тегами <head> ставим:

Код: Выделить всё

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript">
            $(function() {
                $(window).scroll(function(){
					var scrollTop = $(window).scrollTop();
					if(scrollTop != 0)
						$('.ac_footer').stop().animate({'opacity':'0.2'},400);
					else	
						$('.ac_footer').stop().animate({'opacity':'1'},400);
				});
				
				$('.ac_footer').hover(
					function (e) {
						var scrollTop = $(window).scrollTop();
						if(scrollTop != 0){
							$('.ac_footer').stop().animate({'opacity':'1'},400);
						}
					},
					function (e) {
						var scrollTop = $(window).scrollTop();
						if(scrollTop != 0){
							$('.ac_footer').stop().animate({'opacity':'1'},400);
						}
					}
				);
            });
        </script>
Перед закрывающим тегом </body> ставим:

Код: Выделить всё

<div class="ac_footer">
		<a href="#" class="ac_left"><span>Левая</span> ссылка</a>
		<a href="#">Правая ссылка</a>
</div>
Вместо ссылки можно поставить просто надпись или стрелку вверх. Можно соорудить навигационное меню. Всё на ваше усмотрение и фантазию.

В тему стиля:

Код: Выделить всё

.ac_footer {
    background: none repeat scroll 0 0 #000000;
    bottom: 0;
    font-size: 13px;
    height: 20px;
    left: 0;
    opacity: 0.9;
    padding-bottom: 5px;
    position: fixed;
    width: 100%;
    z-index: 999;
}
.ac_footer a {
    font-family: 'PT Sans Narrow',Arial,sans-serif;
    color: #DDDDDD;
    float: right;
    letter-spacing: 0.3px;
    padding: 5px 10px;
    text-shadow: 1px 1px 1px #000000;
    font-size: 11px;
    text-transform: none;
}
.ac_footer a:hover {
    color: #FFFFFF;
}
.ac_footer a span {
    font-weight: bold;
}
.ac_footer a.ac_left {
    float: left;
}
background: none repeat scroll 0 0 #000000; - цвет полосы.
color: #FFFFFF; - цвет текста.
Комментарии: 32

romaamor 02 окт 2012, 10:50 Сообщение

xaocZ писал(а):Вместо ссылки можно поставить просто надпись или стрелку вверх. Можно соорудить навигационное меню. Всё на ваше усмотрение и фантазию.
А можно как то туда вставить script ?
  • 0

CabinetAdmin 02 окт 2012, 14:07 Сообщение

romaamor
Смотря какой.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 02 окт 2012, 15:06 Сообщение

CabinetAdmin писал(а):Смотря какой.
Хочу вставить скрипт Переводчика от гугла.

Код: Выделить всё

<div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'ru', layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
И мета-тег:

Код: Выделить всё

<meta name="google translate-настройки" content="99ac4de820a34d4e-e9999dc4ee289023-g4814ecb503448261-a"></meta>
Он сейчас стоит,работает отлично.Но у меня возникла идея :А если его перенести в полупрозрачнаю полосу в низ экрана ?.Можно такое сотворить.? :)
  • 0

CabinetAdmin 02 окт 2012, 15:13 Сообщение

Мета-тег должен быть между <head> ... </head>, после тега TITLE.

А переводчик, можно, почему нет?...
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 02 окт 2012, 15:24 Сообщение

CabinetAdmin писал(а):Мета-тег должен быть между <head> ... </head>, после тега TITLE.
Ну это я установил правильно.А вот с Скриптом не получилось.Должно быть что то типа так ?

Код: Выделить всё

<div class="ac_footer">
      <div id="google_translate_element"></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'ru', layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</div>
Или я профан полнейший ? :D
  • 0

CabinetAdmin 02 окт 2012, 15:47 Сообщение

Я бы сделал так. Это:

Код: Выделить всё

<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'ru', layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL}, 'google_translate_element');
}
</script>
Я бы поставил перед </head>. Хотя тут надо знать, как оно правильно ставится, по инструкции. А вот:

Код: Выделить всё

<div id="google_translate_element"></div>
Я бы установил в блок:

Код: Выделить всё

<div class="ac_footer" ">
      <div id="google_translate_element"></div>
      <a href="/">Спутниковый рай.Форум любителей спутникового телевидения.</a>
</div>
Плюс в css (#google_translate_element), если он есть, добавил бы float: left;.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 02 окт 2012, 16:01 Сообщение

CabinetAdmin писал(а):Хотя тут надо знать, как оно правильно ставится, по инструкции.
Да ,Вы правы.По инструкции перед
CabinetAdmin писал(а): перед </head>
.
CabinetAdmin писал(а):Плюс в css (#google_translate_element), если он есть, добавил бы float: left;.
Нету.
Спасибо.Заработало. :drink: :ihaaaa:
  • 0

CabinetAdmin 02 окт 2012, 19:14 Сообщение

Под цвет стиля сделал, симпатично получилось:)

Можно ещё вот такую штуку добавить к .ac_footer {:

Код: Выделить всё

      -webkit-box-shadow: 0 -3px 10px #333;
      -moz-box-shadow: 0 -3px 10px #333;
      box-shadow: 0 -3px 10px #333;
Что придаст полосе небольшую тень. Тоже должно выглядеть ничего.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 02 окт 2012, 20:57 Сообщение

CabinetAdmin писал(а): -webkit-box-shadow: 0 -3px 10px #333;
      -moz-box-shadow: 0 -3px 10px #333;
      box-shadow: 0 -3px 10px #333;
CabinetAdmin писал(а):Можно ещё вот такую штуку добавить к
Да.Симпотишно получилось. :drink:
  • 0

deshenez 06 окт 2012, 10:49 Сообщение

Странное что-то такое...
-------------
[спам какой-то]
  • 0

CabinetAdmin 06 окт 2012, 10:55 Сообщение

Что странного?
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 07 апр 2013, 19:48 Сообщение

xaocZ писал(а):Вместо ссылки можно поставить просто надпись или стрелку вверх. Можно соорудить навигационное меню. Всё на ваше усмотрение и фантазию.
А можно бегущую строку с сылками - последние темы ? И если да то как. Одну бегущую строку вставил без проблем, а вот как туда вставить список последних тем - не шарю. :(
  • 0

CabinetAdmin 07 апр 2013, 20:14 Сообщение

Можно. Поставь:

Код: Выделить всё

<!-- BEGIN recenttopicrow -->
	<a href="{recenttopicrow.U_VIEW_TOPIC}" title="{recenttopicrow.TOPIC_TITLE}">{recenttopicrow.TOPIC_TITLE}</a> &#8226; 
<!-- END recenttopicrow -->
Это вырезка из модификации вывода последних тем (NV Recent topics for phpBB3). Не проверял, но работать должно.

Можно установить Recent topics for phpBB3 (Темы на стр. сайта) и использовать скрипт для вывода тем на все страницы форума.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

romaamor 07 апр 2013, 20:57 Сообщение

Установил так -

Код: Выделить всё

<div class="ac_footer">    
  <marquee behavior="alternate" direction="left" bgcolor="#ffcc00">
    <!-- BEGIN recenttopicrow -->
   <a href="{recenttopicrow.U_VIEW_TOPIC}" title="{recenttopicrow.TOPIC_TITLE}">{recenttopicrow.TOPIC_TITLE}</a> &#8226; 
<!-- END recenttopicrow -->
  </marquee>
</div>
На сайте http://shishatskaya.luckbb.ru/ работает, а на http://satray.ru/ нет. У вас видать версия мода другая. :(
  • 0
Последний раз редактировалось romaamor 08 апр 2013, 05:46, всего редактировалось 1 раз.