Здравствуйте, уважаемые. Стоит такая задача: Превратить содержимое div-блока в картинку и предложить пользователю скачать её.
<!DOCTYPE html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
div {
width:200px;
background-color: green;
}
</style>
<script type="text/javascript" src="http://night-creature.com/html2canvas.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
<div id="downimg">
<div>
some text
</div>
</div>
<script language="javascript">
function downimg(){
html2canvas($('#downimg'), {
onrendered: function (canvas) {
var img = canvas.toDataURL('image/png').replace("image/png", "image/octet-stream");
window.location.href = img;
}
});
}
</script>
<a href="javascript:void(0)" onClick="downimg()" >SAVE</a>
</body>
</html>
такто работает, но сохраняет без расширения.Приходиться руками писать png? что не есть хорошо. Нашол решения на сайте
http://updates.html5rocks.com/2011/0...he-client-side но по англиске не понимаю, да и вобще не понял что там к чему. Хотелось бы чтоб как у ни в демо
http://eligrey.com/demos/FileSaver.js/
Кто знает как это сделать
