2015-01-02 21 views
6

Ich möchte die PDF-Datei in einem iframe auf + klicken und klicken Sie auf verkleinern und verkleinern - hier ist mein Design und C#. Die in src angegebene Datei ist eine Dummy-Datei und ich lade die aktuelle Datei bei onload der Seite.Zoomen einer PDF in einem iframe auf Knopf klicken

jeder Ansatz ist in Ordnung für mich, ob es JavaScript, Css, Jquery, serverside .. bitte helfen .. danke im Voraus.

<div style="padding-bottom: 5px; margin-top:1%; width:18%; float:left; text-align:right;"> 
     <asp:Button ID="ZoomIn" Text="+" runat="server" /> 
     <asp:Button ID="ZoomOut" Text="-" runat="server" /> 
</div> 
    <div id="Container" style="float:left; width:100%; text-align: center; padding-bottom: 5px;"> 
     <iframe class="Zoomer" id="iFmManl" runat="server" src="~\sample.pdf" width="100%" height="900px" 
      style="border: 0px inset black; margin-left: 0px;" title="Domain Dictionary"></iframe> 
    </div> 
</div> 

onload auf server:

protected void Page_Load(object sender, EventArgs e) 
{ 
    iFmManl.Attributes["src"] = FileName + "#toolbar=0&navpanes=0&view=Fit"; 
} 

Antwort

0

es Zeichnen auf ein HTML5 canvas Element, und an jeder Zoomstufe neu zu zeichnen.

Sie können Ihre PDF-Datei einfach auf einem Canvas-Element zeichnen. Die Antwort here und pdf.js sind ziemlich einfach zu verwenden.

Von dort können Sie das Canvas-Element vergrößern/verkleinern und im Wesentlichen skalierte Versionen Ihrer PDF-Datei auf Ihrem Canvas-Element neu zeichnen. Achten Sie darauf, den Canvas-Bereich nicht zu skalieren, da dies dazu führen kann, dass Ihr PDF pixelig aussieht. Einfach das PDF neu zu zeichnen wird gut funktionieren.