X

Статистика


Онлайн всего: 1
Гостей: 1
Пользователей: 0


Нас сегодня посетили

Мини-профиль по клику правой кнопки мыши для uCoz

Мини-профиль по клику правой кнопки мыши для uCoz
Мини-профиль по клику правой кнопки мыши для uCoz
  • Оценки читателей

    ЗАКРЫТЬ
    • 0 Лайк
    • 0 Лавки
    • 0 Ахахах!
    • 0 Ого!
    • 0 Восторг
    • 0 Печаль
    • 0 Грусняшь
Интересный скрипт, который будет открывать мини-профиль пользователя по клику на правую кнопки мыши.

Установка

Перед установкой скрипта настоятельно рекомендую сделать бекап шаблона ("Дизайн" — "Резервное копирование шаблона" — "Создать резервную копию".

1. Добавляем на всех страницах после Body:
Код
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">  
  <?if($USER_LOGGED_IN$)?>  
  <ul class="contextMenu" hidden>  
  <li><a href="$PERSONAL_PAGE_LINK$"><i class="fa fa-user"></i> $USERNAME$</a></li>  
  <li><a href="/load/0-0-0-0-1"><i class="fa fa-file-o"></i> Добавить файл</a></li>  
  <li><a href="/news/0-0-0-0-1"><i class="fa fa-newspaper-o"></i> Добавить новость</a></li>  
  <li><a href="/photo/0-0-0-1-2"><i class="fa fa-picture-o"></i> Добавить фото</a></li>  
  <li><a href="/publ/0-0-0-0-1"><i class="fa fa-file-text-o"></i> Добавить Статью</a></li>  
  <li>  
  <a class="fa fa-users" href="/index/15"></a>  
  <a class="fa fa-inbox" href="/index/14"></a>  
  <a class="fa fa-pencil" href="/index/11"></a>  
  <a class="fa fa-sign-out" href="/index/10"></a>  
  </li>  
  </ul>  
  <?endif?>

2. На этой же странице добавляем скрипт :
Код
<script type="text/javascript">  
  $(document).bind("contextmenu", function(event) {  
  event.preventDefault();  
  $("ul.contextMenu")  
  .show()  
  .css({top: event.pageY + 15, left: event.pageX + 10});  
  });  
  $(document).click(function() {  
  isHovered = $("ul.contextMenu").is(":hover");  
  if (isHovered == false){  
  $("ul.contextMenu").fadeOut("fast");  
  }  
  });  
  </script>

3. Добавляем стили в конец таблицы стилей CSS вставляем:
Код
ul.contextMenu{  
  list-style:none;  
  margin:0;padding:0;  
  font: 300 15px 'Roboto', sans-serif;  
  position: absolute;  
  color: #333;  
  box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.2);  
  }  

  ul.contextMenu *{  
  transition:color .4s, background .4s;  
  }  

  ul.contextMenu li{  
  min-width:150px;  
  overflow: hidden;  
  white-space: nowrap;  
  padding: 12px 15px;  
  background-color: #fff;  
  border-bottom:1px solid #ecf0f1;  
  }  

  ul.contextMenu li a{  
  color:#333;  
  text-decoration:none;  
  }  

  ul.contextMenu li:hover{  
  background-color: #ecf0f1;  
  }  

  ul.contextMenu li:first-child{  
  border-radius: 5px 5px 0 0;  
  }  

  ul.contextMenu li:last-child{  
  background:#ecf0f1;  
  border-bottom:0;  
  border-radius: 0 0 5px 5px  
  }  

  ul.contextMenu li:last-child a{width:26%;}  
  ul.contextMenu li:last-child:hover a{color:#2c3e50}  
  ul.contextMenu li:last-child:hover a:hover{color:#2980b9}
Скачать бесплатно - [.]
без регистрации через 5 сек.
Или скачать без ожидания.
Комментарии (0 )
avatar
  • Материал пренадлежит данному сайту и ссылка на источник обязательна. uCozBook.ru
Нужна помощь?
Мнение о материале