Плагин Zooming jQuery для масштабирования страницы

Мне нужно jQuery Plugin, чтобы увеличить страницу максимум на 3 уровня больше и на 3 уровня меньше.

  • Выбранный масштаб должен храниться в файле cookie / где-то, чтобы отображать тот же выбранный размер масштаба, даже если пользователь обновляет страницу.
  • На веб-сайте также есть всплывающее окно, поэтому моя всплывающая страница тоже должна работать с ним.
  • Он должен работать со всеми браузерами, такими как Firefox, Chrome, IE8, Safari, Mac Safari.
  • Он должен работать с другими устройствами, такими как IPAD, IPHONE, Android Mobile, Windows Mobile.

Я ломаю голову, чтобы решить эту проблему. Кто-нибудь, пожалуйста, предложите хороший плагин jQuery/любые другие библиотеки для решения этой проблемы.


person Jeya sankar    schedule 17.06.2013    source источник


Ответы (2)


Я только что попробовал Zoomooz.js. У меня отлично работает с FF и IE8.

person jimmybondy    schedule 24.10.2013
comment
Большое спасибо, это именно то, что я искал! - person Guillaume Lehezee; 24.03.2014

Вот пример масштабирования страницы с помощью jQuery:

 window.onload = function() {
 var currFFZoom = 1;
 var currIEZoom = 100;

 $('#In').on('click',function(){
     if (navigator.userAgent.indexOf('Firefox') != -1 && parseFloat(navigator.userAgent.substring(navigator.userAgent.indexOf('Firefox') + 8)) >= 3.6){//Firefox
         var step = 0.02;
         currFFZoom += step; 
         $('body').css('MozTransform','scale(' + currFFZoom + ')');
     } else {
         var step = 2;
         currIEZoom += step;
         $('body').css('zoom', ' ' + currIEZoom + '%');
     }
 });

 $('#Out').on('click',function(){
     if (navigator.userAgent.indexOf('Firefox') != -1 && parseFloat(navigator.userAgent.substring(navigator.userAgent.indexOf('Firefox') + 8)) >= 3.6){//Firefox
         var step = 0.02;
         currFFZoom -= step;                 
         $('body').css('MozTransform','scale(' + currFFZoom + ')');

     } else {
         var step = 2;
         currIEZoom -= step;
         $('body').css('zoom', ' ' + currIEZoom + '%');
     }
 });};


 <input type="button" id="Out" alt="Zoom Out"/>
 <input type="button" id="In" alt="Zoom In"/>

Примечание. Я не проверял это во многих браузерах.

person mitchfish36    schedule 17.06.2013
comment
Ответ должен быть плагином jQuery или любой другой библиотекой, потому что у кода есть проблема с кросс-браузером. - person Venkat.R; 17.06.2013