HTML
1<div style="zoom:0.5;"></div>
上記のように zoom を指定したボックスで clientX,Y を取得するとずれてしまうのですが、何とかならないでしょうか?
よろしくお願いいたします。
追記
HTML
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="UTF-8"> 5 <title>Insert title here</title> 6 <link href="css/jquery-ui.min.css" rel="stylesheet" type="text/css" /> 7 <link href="css/jquery-ui.structure.min.css" rel="stylesheet" type="text/css" /> 8 <script type="text/javascript" src="js/jquery.min.js"></script> 9 <script type="text/javascript" src="js/jquery-ui.min.js"></script> 10 11 <script type="text/javascript" src="js/mascat.resizable.js"></script> 12 <script type="text/javascript" src="js/mascat.draggable.js"></script> 13 14 <style type="text/css"> 15 * { 16 margin : 0; 17 padding: 0; 18 } 19 .Toolbar { 20 height : 1.5em; 21 } 22 .Drawing { 23 height : 1000px; 24 width : 100%; 25 background-color: #CCDDFF; 26 zoom : 0.5; 27 } 28 .Axis { 29 position: absolute; 30 } 31 .Axis.Horizontal { 32 height : 1px; 33 width : 100%; 34 background-color: #000000; 35 } 36 .Axis.Vertical { 37 height : 100%; 38 width : 1px; 39 background-color: #000000; 40 } 41 </style> 42</head> 43<body> 44 <div class="Toolbar"> 45 <div>test</div> 46 </div> 47 <div class="Drawing"> 48 <div class="Axis Horizontal"></div> 49 <div class="Axis Vertical"></div> 50 </div> 51 <script type="text/javascript"> 52 jQuery( document ).bind( 'mousemove', function ( evt ) { 53 var pos = [ evt.clientX, evt.clientY ]; 54 55 jQuery( '.Drawing .Axis.Horizontal' ).css( 'top', pos[ 1 ] ); 56 jQuery( '.Drawing .Axis.Vertical' ).css( 'left', pos[ 0 ] ); 57 } ); 58 </script> 59</body> 60</html>
再現する最低限のコードです
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/02/24 15:38
2016/02/24 22:35 編集