jquery - javascript PRINT functionality -
i doing image zoom , pan modal.
all working fine, use floor plans. add print button ( same style ) viewer.
see example: http://test.dpetroff.ru/jquery.iviewer/test/
need appear next [ 200% ] button.
any suggestions ?
the js here: http://test.dpetroff.ru/jquery.iviewer/jquery.iviewer.js
my html code:
var $ = jquery; $(document).ready(function(){ $("#viewer").iviewer( { src: "images/floorplan.gif", update_on_resize: false, zoom: 200, initcallback: function () { var object = this; $("#in").click(function(){ object.zoom_by(1);}); $("#out").click(function(){ object.zoom_by(-1);}); $("#fit").click(function(){ object.fit();}); $("#orig").click(function(){ object.set_zoom(100); }); $("#update").click(function(){ object.update_container_info();}); console.log(this.img_object.display_width); //works* console.log(object.img_object.display_width); //getting undefined.* }, onfinishload: function() { $("#viewer").data('viewer').setcoords(-500,-500); //this.setcoords(-0, -500); } // onmousemove: function(object, coords) { }, // onstartdrag: function(object, coords) { return false; }, //this image not dragged // ondrag: function(object, coords) { } });
update:
ok isn't 100% not sure why.
here html
<div class="wrapper"> <div id="viewer" class="viewer"></div> <div class="iviewer_zoom_print iviewer_common iviewer_button2"><a href="javascript:window.print()">print</a></div> </div>
here css:
.iviewer_zoom_print { left: 170px; font: 1em/28px "helveticaneue","helvetica neue",helvetica,arial,"lucida grande",sans-serif; color: #ec008c; background-color: #fff; text-align: center; text-decoration:none width: 60px;
link css
.iviewer_zoom_print a:link { text-decoration:none !important;color:#ec008c !important;}
here preview.
ok issue have, code best way of accomplishing ? how position print button better. js must enabled because modal window, non js print functionality isnt prerequisite.
also need on click of print button prints entire image. @ moment prints in view.
any appreciated.
add div
class iviewer_button
existing iviewer_zoom_fit iviewer_common
used fit image. call printing function.
<div class="iviewer_print iviewer_common iviewer_button"></div>
for implementation of print see sample , documentation here
Comments
Post a Comment