Как уменьшить размер изображения с помощью JS?
Добрый день. Хочу поставить на свой сайт готовый скрипт игры "пазлы". Но, хочу немного его доработать. Т.е. добавить возможность загрузки своей картинки из интернета.
Есть проблема. Если картинка имеет слишком большое разрешение, то играть становится не удобно. Как уменьшить эту картинку до адекватного размера, чтобы она не выходила за рамки окна? Пробовал сделать это через canvas https://jsfiddle.net/mbL2tfvp/ Т.е. сначала загрузить в canvas и уменьшить, затем считать из него же и создать новый тег img. Выводит ошибку: Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported. Т.е. браузер начинает ругаться из-за политики безопасности. Вот сам скрипт пазлов http://www.2meter3.de/jqPuzzle/index.html Есть какие-нибудь ещё варианты? Грузить сначала на сервак и там уменьшать хотелось бы в последнюю очередь. Потом всё это будет занимать место и нужно будет постоянно чистить. Хотелось бы на клиенте всё реализовать. |
Dimaz,
проще добавить 5 строк в плагин |
Цитата:
|
Dimaz,
открыть плагин -- подумать и добавить параметры для высоты и ширины |
Цитата:
$srcImg.css({width:'auto',height:'auto',visibility:'visible'}); Менял эту строчку кода. Изображение не стало меньше, оно просто обрезалось. |
Dimaz,
направление мысли правильное - и как раз получили нужный размер и никаких обрезаний нету - думайте дальше :) что же такое "обрезалось" и как это поправить ? в прочем уже есть готовый вариант и даже под современую jquery :write: |
Цитата:
|
Цитата:
осталось добавить в пару мест backgroundSize и отменить устаревшие методы jquery, желаите сами помучатся или договоримся? :lol: |
Цитата:
Устаревшие методы? Имеете в виду это: Uncaught TypeError: Cannot read property 'msie' of undefined Если да, то уже удалил этот код. P.S. хотя лучше наверно не удалять, а поменять) а хотя IE вообще скоро не будет. В win10 хотят убрать его и поменять на новый браузер Spartan. |
Сделал. Спасибо за помощь!
|
Часовой пояс GMT +3, время: 21:58. |