الحصول على ارتفاع المنشأ وشعبة ل

Question

وأنا وضعت المغلق للشعبة و

height:130px;
overflow:hidden;

وأريد للرسوم المتحركة من ارتفاع الحالي إلى ارتفاع الأصل مثل هذا ، ولكن لا أستطيع الحصول على الطريق أصل height.one POSIBLE هي بعد دوم تحميل، تخزين ارتفاع في شبيبة، مثل هذا

$(function(){
    $('.detail').data('originHeight',$('.detail').height());
    $('.detail').css({height:'130px',overflow:'hidden'})
})

ولكن القيام بذلك، فإن شعبة تظهر أولا قبل كل شيء، ثم ارتفاع المقرر أن 130px.

وأي اقتراحات؟

Answer 1

ولقد فعلت هذا من قبل باستخدام خاصية scrollHeight للعنصر.

document.getElementById('element').scrollHeight;

وهذا يخبرك كيف طويل القامة العنصر سيكون إذا تم تعيين الارتفاع إلى auto وتمكين overflow.

Answer 2

وهذه الطريقة لديك هو الطريق الصحيح، ولكن قد تحتاج بعض الخارقة لتجنب وميض البصري أن هذا سوف اعطيكم.

وحاول نقل شعبة خارج الشاشة، والتحقق من ارتفاع ثم تتحرك مرة أخرى. أيضا بينما نحن هنا، وتجنب استخدام متعددة مسج نظرة المنبثقة إن أمكن $('.detail') وهذا يمكن أن يكون عملية مكلفة للغاية.

var $detail = $('.detail');
$detail
    .css({position : 'absolute', left: '-10000px'})
    .data('origHeight', $detail.height())
    .css({position : '', left : '', height : '130px', overflow : 'hidden'})
;

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

Answer 3

لا يمكن قمت بتوسيع عناصر div عن طريق إزالة المغلق سمات بدلا من ذلك؟

$('.detail').css({height:'', overflow:''})

Answer 4

وأنا أفكر أن يكون السبيل الوحيد. لأنه إذا قمت بتعديل ارتفاع باستخدام CSS في مسج، أصبح ارتفاع ذروة تعديلها. وارتفاع المعدل هو الذي سوف الوصول إليها.

والسيناريو الوحيد الممكن أستطيع أن أفكر في هو متجر الارتفاع الأصلي باستخدام مسج أو ربما توفير طولك الثابتة وأقول مسج كم من الوقت سوف توسع.