تغيير حجم cfwindow بشكل ديناميكي لتناسب المحتوى

Question

أعمل حاليًا على موقع يستخدم الكثير من كائنات CFWindow وكنت أتساءل عما إذا كان أي شخص يعرف طريقة لتغيير حجم النافذة ديناميكيًا بحيث يناسب جميع المحتوى دون الحاجة إلى تمرير أشرطة.

لقد حاولت استخدام التكوين المرئي = لا يبدو أنه يحدث فرقًا.

شكرا مقدما على أي نصيحة.

Answer 1

حسنًا ، هذه مهمة كلاسيكية عند استخدام المنبثقة لعرض الصور. تم ذلك عن طريق قياس حجم الصورة وتغيير حجم النافذة التي تفرج window.resizeBy(w,h). هذا لا يزال طريقة قابلة للتطبيق ، على ما أعتقد.

الخيار الثاني المماثل هو حساب الحجم المطلوب على جانب الخادم والانتقال إلى cfwindow صفات width و height. قل ، يمكنك التقاط المحتوى في cfcontent وتحقق من طولها في الشخصيات.

يرجى ملاحظة أن كلتا الطريقتين غير موثوقين عندما تعمل مع محتوى نص ، لأن تقديم الخطوط يمكن أن يكون مختلفًا حقًا للمستخدمين. لذلك ، يمكن أن يكون الاحتفاظ ببعض الارتفاع الإضافي مفيدًا.

هناك طريقة صعبة أخرى هي التحقق مما إذا كانت أشرطة التمرير موجودة ، للنافذة التي تم فتحها بالفعل. هناك سمة scrollHeight الذي يمكنك مقارنته مع clientHeight وزيادة الارتفاع. هذا يمكن أن ينتج عن بعض التأثيرات القبيحة "القفز" في بعض المتصفحات ، ولكن يجب أن تعمل.

كنت مهتمًا وحاولت اختبارًا سريعًا للطريقة الأخيرة. ولدت أولاً منبثقة مع ث/هـ = 200 ونص الإجابة (الكلمات أعلاه) كمحتويات. بعد ذلك فعلت هذا في النافذة المنبثقة:

<script type="text/javascript">
window.onload = function() {

    // check the size before resize
    alert("Window Width = " + window.innerWidth + "\nWindow Height = " + window.innerHeight + "\nScrollHeight =  " + document.body.scrollHeight);

    if (window.innerHeight < document.body.scrollHeight) {
        // here's where we can play with resize steps and other specific trickery
        // now we're trying to expand size a bit
        window.resizeBy(window.innerWidth + 50, window.innerHeight + 50);
    }

    // check the size after resize
    alert("Window Width = " + window.innerWidth + "\nWindow Height = " + window.innerHeight + "\nScrollHeight =  " + document.body.scrollHeight);

}
</script>

التنبيه رقم 1:

Window Width = 200
Window Height = 200
ScrollHeight =  783

التنبيه رقم 2:

Window Width = 450
Window Height = 450
ScrollHeight =  358

يرجى ملاحظة أنني لست متأكدًا بنسبة 100 ٪ (ولا يمكنني التحقق من ذلك الآن) window.innerWidth/Height ستعمل السمات في IE - يجب أن تفكر أيضًا document.documentElement.clientWidth/Height صفات.

أتمنى أن يساعدك هذا.