Dalam aktivitas pemasaran H5, gambar sering kali dibuat untuk dibagikan atau disimpan oleh pengguna.
Salah satunya adalah membiarkan backend menghasilkan gambar dan mengembalikan alamat gambar ke frontend untuk ditampilkan.
Salah satunya adalah menggabungkan front-end secara independen untuk menghasilkan tampilan gambar. Artikel ini terutama menjelaskan solusi ini.
demo
<!--IMG disimpan setelah pembuatan--><img src= id=saveImages <img src=> <div class=name pa></div> <div class=msg pa></div></div> < gaya>#saveContent{lebar: 7,5rem; tinggi: 12,27rem; posisi: relatif;}#saveContent img{ lebar: 100%;}#saveContent .name{color: #7c5234;ukuran font: .3rem;atas: 6.55rem;tinggi garis: .6rem;perataan teks: tengah;kiri: 0;kanan: 0;}#saveContent .msg{color: #7c5234;ukuran font: .24rem;atas: 7.35rem;perataan teks: tengah;kiri: 0;kanan: 0;}#saveContent .msg span{ color: #cf5350; ukuran font: .36rem;}</style>
<!--Gunakan html2canvas versi terbaru--><!--Situs web resmi https://html2canvas.hertzen.com/--><script src=//html2canvas.hertzen.com/dist/html2canvas.min. js> </skrip><skrip src=//static.leiting.com/lib/jquery-1.9.0.min.js></script><script>//Hasilkan $(function(){ var isCreate=false; $('a.create' ).on('klik',function(){ isCreate=true; $('#saveContent img').attr('src','//activity.leiting.com/wd/201904/data/images/pop/1.jpg'); $('#saveContent .name').html('aaaaaa') ); $('#saveContent .msg').html('bbbbbbbbbb'); html2canvas(document.getElementById('saveContent'), { dirender: function(ca) { $('#saveImages').attr('src',ca.toDataURL('image/jpeg')); } } } )})</skrip>
Di atas adalah keseluruhan isi artikel ini, saya harap dapat bermanfaat untuk pembelajaran semua orang. Saya juga berharap semua orang mendukung VeVb Wulin Network.