废话不多说直接上代码，在手机上完美实现了手势控制而且不会去扩大上面的内容




    
        
        
        
        PDF.js viewer


        


        
        
        


        


    

    
        

            
                
                    
                        
                            
                            
                            
                            
                        
                    

                    
                        
                            

                            
                        
                    
                
                
                    
                    
                    
                    
                    
                    
                    
                    
                
                
            
 

            
                
                    
                        
                        
                            
                            
                            
                        
                    

                    
                        
                        Highlight
                            all
                        
                        Match
                            case
                    
                    
                        
                        Whole
                            words
                        
                    

                    
                        
                    
                
 

                
                    
                        

                        

                        

                        

                        
                            Current View
                        

                        

                        
                        

                        

                        
                        

                        

                        
                        

                        

                        
                        
                        

                        

                        
                        
                        

                        

                        
                    
                
 

                
                    
                        
                            
                                
                                
                                
                                
                                    
                                    
                                    
                                
                                
                                
                            
                            
                                

                                

                                

                                
                                
                                    Current View
                                

                                

                                
                            
                            
                                
                                    
                                    
                                    
                                
                                
                                    
                                
                            
                        
                        
                            
                                
                                
                            
                        
                    
                

                
                    
                

                
                    
                        
                        
                        
                    
                    
                        
                    
                    
                    
                
            
 

            
                
                    
                        
                            Enter the password to open this PDF file:
                            
                        
                        
                            
                        
                        
                            
                            
                        
                    
                
                
                    
                        
                            File name:
                            -
                        
                        
                            File size:
                            -
                        
                        
                        
                            Title:
                            -
                        
                        
                            Author:
                            -
                        
                        
                            Subject:
                            -
                        
                        
                            Keywords:
                            -
                        
                        
                            Creation Date:
                            -
                        
                        
                            Modification Date:
                            -
                        
                        
                            Creator:
                            -
                        
                        
                        
                            PDF Producer:
                            -
                        
                        
                            PDF Version:
                            -
                        
                        
                            Page Count:
                            -
                        
                        
                            Page Size:
                            -
                        
                        
                        
                            Fast Web View:
                            -
                        
                        
                            
                        
                    
                
                
                    
                        
                            Preparing document for printing…
                        
                        
                            
                            0%

重点在body结束之后的脚本这里完美实现了手势控制，来源于pdfjs里面的issue 国外老哥贡献的这里做个记录
下面代码就是实现关键字高亮的，提高用户体验这里找到viewer.js 替换即可

  setInitialView(view = _ui_utils.SidebarView.NONE) {
    if (this.isInitialViewSet) {
      return;
    }
    this.isInitialViewSet = true;
    //获取链接
       var urlPath=decodeURIComponent(window.location.href);
       var index=urlPath.indexOf("&keyword");
       //获取关键词
       var keyword=urlPath.substr(index+9);
            console.log('---------------',keyword)
       //对查询输入框进行赋值
       document.getElementById("findInput").value=keyword;
       //点击高亮按钮实现高亮显示关键词
       document.getElementById("findHighlightAll").click();
    if (view === _ui_utils.SidebarView.NONE || view === _ui_utils.SidebarView.UNKNOWN) {
      this._dispatchEvent();

      return;
    }

    if (!this._switchView(view, true)) {
      this._dispatchEvent();
    }

  }

url 传递keyword 即可实现高亮
最终效果如下：

image.png

pdfjs 完美实现在微信浏览器中展示以及手势控制

你可能感兴趣的:(pdfjs 完美实现在微信浏览器中展示以及手势控制)