Blogger Information
Blog 17
fans 1
comment 1
visits 16378
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
仿百度搜索
雷国恩的博客
Original
1371 people have browsed it

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Document</title>
 <style type="text/css">
    #content {
    width:500px;
    height:200px;
    margin:50px auto;
    border:1px solid #ccc;
    padding:10px;
    border-radius: 5px;
    overflow: auto;
  }
  #nav_menu {
    width:100px;
    height:30px;
    background: #fff;
    line-height: 30px;
    padding:5px;
    border-radius: 5px;
    border:1px solid #ccc;
    display: none;
    position: fixed;
    top:0;
    left:0;
  }
  #nav_menu button {
    background: transparent;
    border:0;
    color:green;
    cursor: pointer;
  }
  #nav_menu button:hover {
    color: red;
  }
  </style>
</head>
<body>
    <div id="content" onmouseup="change(event)">
    前劳斯莱斯规划履行官吉尔斯泰勒现已搬到一汽轿车部门红旗,从事豪华车的出产。该***转换为“红旗”,出产一些最贵重的中国轿车。贾尔斯泰勒具有26年轿车规划生计,曾先后服务于雪铁龙、捷豹和劳斯莱斯***,主导规划了雪铁龙C3概念车和捷豹XJ、XK等车型。来源:百家号
   </div>
  <p id="nav_menu"><button onclick="copyText()">复制</button>|<button onclick="getSearch()">搜索</button></p>
  <script type="text/javascript">
    function getSelect(){
     return window.getSelection().toString();
    }
    function change(event){
     var str=getSelect();
     var e=event || window.event;
     if(str.length>0){
      var x=e.clientX;
      var y=e.clientY;
      var menu=document.getElementById('nav_menu');
      menu.style.left=x+'px';
      menu.style.top=y+"px";
      menu.style.display="block";
     }else{
      menu.style.display="none";
     }
    }

    function copyText(){
     document.execCommand('Copy');
     document.getElementById('nav_menu').style.display="none";
    }

    function getSearch(){
     if(getSelect()){
      window.location.href="https://www.baidu.com/s?ie=utf-8&f=3&rsv_bp=1&rsv_idx=1&tn=baidu&wd="+getSelect();
     }
     document.getElementById('nav_menu').style.display="none";
    }
  </script>
 
</body>
</html>

Correction status:Uncorrected

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!