标签:ase import lang enc content mat scheme 控制 功能
1.该功能需要引入的js
2..jsp页面源码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <style> /*图片平移的抓手样式*/ .grab { cursor: -webkit-grab; cursor: -moz-grab; cursor: grab; } .grabbing { cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: grabbing; } </style> </head> <body> jsp页面上图片查看时的左右旋转与放大缩小 <br> <button id="check">查看图片</button> <script src="${basePath}js/jquery.min.js"></script> <script src="${basePath}js/layer/layer.js"></script> <script src="${basePath}js/yyl-photo-look.js"></script> <script type="text/javascript"> var basePath=‘${basePath}‘; $("#check").click(function(){ var window_h=$(window).height(); parent.layer.open({ type: 1, id:‘img-yyl-container‘,//自定义id title: false,//不显示标题 skin: ‘layui-layer-rim‘, //加上边框 area: [‘99%‘, ‘99%‘], //宽高 content: ‘<div style="text-align: center;width:100%;height:‘+window_h+‘px;overflow:hidden;"><img class="grab" src=\"image/E@RKDZS6V5DNCS)}N52Y}]9.jpg?t=‘+Math.random()+‘\" style="position: absolute;top: 50%;left:50%;-webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%);transform: translate(-50%,-50%);" id="currentImg"/><div style="position:absolute;bottom:20px;left:50%;margin-left:-66px;"><img title="左转90度" src="image/btn_turnleft.png" onclick="tranImg(-90,\‘currentImg\‘)"> <img title="右转90度" src="image/btn_turnright.png" onclick="tranImg(90,\‘currentImg\‘)"> <img title="放大" src="image/btn_zoomin.png" onclick="bigORsamll_img(\‘big\‘,\‘currentImg\‘)"> <img title="缩小" src="image/btn_zoomout.png" onclick="bigORsamll_img(\‘small\‘,\‘currentImg\‘)"></div></div><script>photo_yyl_look("currentImg");$("#img-yyl-container").css("overflow","hidden");<\/script>‘ }); }); </script> </body> </html>
标签:ase import lang enc content mat scheme 控制 功能
原文地址:http://www.cnblogs.com/zheaven/p/7681022.html