Блог

Демо

Если понравилось то переходим к установке

1-ое
Переходим в таблицу стилей (css) и вставляем туда:

Code

.qopa{border:1px solid #c7c7c7;background:#f5f5dc;padding:3px;margin-right:2px;margin-bottom:3px}.qopa:hover{border:2px solid #c7c7c7;}
.qop {width:250px;height:180px;position:fixed; z-index: 9999;border:1px solid #c7c7c7;background:#f5f5dc;padding:3px;margin-right:2px;margin-bottom:3px;right:10px;bottom:0px;opacity:0.9;display:none;}

это стиль самой панели

2-ое
Вставляем в самый низ сайта (на те страницы где хотим увидеть ее)

Code

<div class="qop"><center><div class="qopa main" title="Главная"><a href="/">Главная страница</a></div>
  <div class="qopa video" title="Видео"><a href="/board/">Видео</a></div>
  <div class="qopa text" title="Тесты песен"><a href="/load/">Тексты песен</a></div>
  <div class="qopa forom" title="Форум"><a href="/forum/">Форум</a></div>
  <h1>V-mus.ru</h1>
  </center>
  </div>

  <div id="panb" style="display:none;left: 0px;top: 0px;background-position: 0% 0%; background-origin: padding-box; background-color: #ffffff; opacity: 0.6; position: fixed; width: 100%; height: 100%; background-attachment: scroll; background-repeat: repeat; background-image: none; background-size: auto; background-clip: border-box; z-index: 10"></div>

  <script>
  $("html").attr("oncontextmenu", "$('#panb').slideToggle(100);$('.qop').slideToggle(500);return false;");
  $("html").attr("ondragstart", "$('#panb').slideToggle(100);$('.qop').slideToggle(500);return false;");
  $('#panb').click(function() {
  $('#panb').slideToggle(0);
  $('.qop').slideToggle(500);
  });
  </script>