jQuery
【jQuery】ページをズームインまたはズームアウトできるようにjQuery Page Zoom
February 4, 2017

jQuery Page Zoomはリンクまたはボタン(onClickイベントを受け入れるもの)を使用して、ページを拡大または縮小できるようにします。
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="./javascript/js.cookie.js"></script> <script type="text/javascript" src="./javascript/jquery.page_zoom.js"></script>
<ul> <li><a href="#" class="zoom_in">Zoom In</a></li> <li><a href="#" class="zoom_out">Zoom Out</a></li> <li><a href="#" class="zoom_reset">Reset Zoom</a></li> </ul>
$(document).ready(function() { $.page_zoom(); });
var options = { max_zoom: 1.5, // maximum amount you can zoom in. 1.5 = 150% zoom min_zoom: .5, // the minimum amount you can zoom out. .5 = 50% zoom zoom_increment: .1, // how much each click zooms in/out. So if the current zoom is 1.3, one click of the zoom out link means 1.3 - 0.1 = 1.2. New zoom level is 1.2 current_zoom: 1, // default zoom. don't set this unless you want to force a zoom level on each page load selectors: { zoom_in: '.zoom_in', // the selector for the element(s) that will get the zoom in action for the onclick event zoom_out: '.zoom_out', // the selector for the element(s) that will get the zoom out action for the onclick event zoom_reset: '.zoom_reset' // the selector for the element(s) that will get the reset zoom action for the onclick event } }; $.page_zoom(options);
MIT