學習筆記6

時間 2019-11-12

標籤學習筆記简体版

原文原文鏈接

1、最小特權原則

小特權原則是系統安全中最基本的原則之一。所謂最小特權(Least Privilege)，指的是"在完成某種操做時所賦予網絡中每一個主體(用戶或進程)必不可少的特權"。最小特權原則，則是指"應限定網絡中每一個主體所必須的最小特權，確保可能的事故、錯誤、網絡部件的篡改等緣由形成的損失最小"。css

最小特權原則一方面給予主體"必不可少"的特權，這就保證了全部的主體都能在所賦予的特權之下完成所須要完成的任務或操做;另外一方面，它只給予主體"必不可少"的特權，這就限制了每一個主體所能進行的操做。html

2、例題：放大鏡

html:jquery

`<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>放大鏡</title>
    <style>
      *{
        margin:0;
        padding: 0;
      }
      #container{
        margin-left: 50px;
        position: relative;
      }
      #left{
        width: 430px;
        height: 430px;
        position: relative;
      }
      #inner{
        width:231px;
        height: 231px;
        background-image: url(../images/21_03.png);
        position: absolute;
        left: 0;
        top: 0;
        opacity: 0.6;
        display: none;
      }
      #tages li{
        width: 60px;
        height: 60px;
        list-style: none;
        float: left;
        margin-top: 3px;
      }
      #right{
        width: 430px;
        height: 430px;
        position: absolute;
        left: 500px;
        top: 0;
        overflow: hidden;
      }
    </style>
  </head>
  <body>
  <div id="container">
    <div id="left">
      <img src="../images/imgA_2.jpg" alt="">
      <div id="inner"></div>
    </div>
    <ul id="tages">
      <li><img src="../images/imgA_1.jpg"></li>
      <li><img src="../images/imgB_1.jpg"></li>
      <li><img src="../images/imgC_1.jpg"></li>
      <li><img src="../images/imgD_1.jpg"></li>
    </ul>
    <div id="right"></div>
  </div>

  <script src="../js/jquery-1.12.4.js"></script>
  <script src="../js/放大鏡.js"></script>
  </body>
</html>
`

js:web

`$(function(){
  var setPosition;
  if((/IE [678]/).test(navigator.userAgent)) {
    setPosition = function(jDom, x, y) {
      jDom.css({
        left: x + 'px',
        top: y + 'px'
      });
    };
  } else {
    setPosition = function(jDom, x, y) {
      jDom.css({
        transform: 'translate(' + x + 'px, ' + y + 'px)',
        WebkitTransform: 'translate(' + x + 'px, ' + y + 'px)',
        MozTransform: 'translate(' + x + 'px, ' + y + 'px)',
        OTransform: 'translate(' + x + 'px, ' + y + 'px)',
        msTransform: 'translate(' + x + 'px, ' + y + 'px)'
      });
    };
  }

  $('#tages').on('mouseenter','li img',function(){
    var imgPath = $(this).prop('src');
    var newPath = imgPath.replace(/_1/,'_2');
    $('#left img').prop('src',newPath) ;
  });

  $('#left').on('mouseenter',function(){
    $('#inner').show();
    $('<img>').prop('src', $('#left img').prop('src').replace(/_2/, '_3')).appendTo($('#right'));
  }).on('mousemove',function(event){
    var x = event.pageX - 115.5 -$('#left').offset().left;
    if(x<0){
      x=0;
    }else if(x>199){
      x=199;
    }

    var y = event.pageY - 115.5 -$('#left').offset().top;
    if(y<0){
      y=0;
    }else if(y>199){
      y=199;
    }
    setPosition($('#inner'),x,y);
    setPosition($('#right img'), -x * 800 / 430, -y * 800 /430);
  }).on('mouseleave',function(){
    $('#inner').hide();
    $('#right').empty();
  });
});
`