تغيير حجم الصور مع قضية الفضاد Canvas - CSS

Question

أنا أعمل على ميزة تغيير حجم صورة JavaScript والتي تعتمد على IE فقط Dximagetransformform.

الرغبة في معالجة المتصفحات الحديثة أيضا، أعطيت لقطة من قماش، مع نتائج جيدة جدا.

ومع ذلك، أواجه مشكلة في دالة تغيير الحجم بي، وهذا ما يلي:

دالة تغيير حجم (OOBJ، FLMULTIPIER) {var canvas = document.getelementbyid ('canvas')؛ var canvascontext = canvas.getContext ('2D')؛ ooobj.style.visibility = 'مخفي'؛ CANVASCONTEXT.CLEARRECT (0،0، Canvas.width، Canvas.height)؛ // مسح قماش canvascontext.fillstyle = 'RGBA (0،0،0،0.4)'؛ canvascontext.scale (flmultiplier، flmultiplier)؛ canvascontext.drawimage (OOBJ، 0، 0)؛ }

إذا أصبحت صورتي أكبر من عنصر القماش، فسترى المرء جزءا فقط من الصورة، وهو أمر سيء.

حاولت تعديل حجم القماش في وقت التشغيل، ولكن إذا كان يؤثر على عرض الصورة المعلنة.

لذلك انتهى بي الأمر معلنة كبير عنصر قماش، وهو ما يرام، باستثناء أن تجاوز فرط CSS لصفحة الويب الخاصة بي على عنصري الأكبر، وليس على صورتي المعززة، وهو ألم.

لذلك أعتقد أن هناك طريقتان لحل مشكلتي:

1. حاول استبعاد عنصر قماش كبير من نظام تجاوز الفائض
2. حاول تحديث حجم عنصر قماش عند تغيير حجم (ربما فاتني بشيء هناك)

Answer 1

لم أحاول نفسي، ولكن ربما يمكنك إنشاء عنصر قماش من دوم، مع document.createElement. وبعد يمكن أن يكون حجم تعسفيا دون إزعاج الشاشة.

الآن، أفتقر إلى السياق (لماذا تقوم بتغيير حجم الصور بهذه الطريقة بدلا من استخدام سمات العرض والارتفاع، من بين أسئلة أخرى)، لذا ربما أفتقد النقطة.