Панель, появляющаяся при правом клике

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

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>

  • FalleN

  • 1105

  • 1

  • 0

Ссылки на статью:

Прямая ссылка:
HTML-код:
ББ-код:

Похожие статьи:

Добавить комментарий:

Для добавления вы должны авторизироваться!