Re: [問題] div無法顯示

[TonyQ (沉默是金。)]

        你這問題的核心原因跟 JScrollPane 運作原理有關。


        你看一下 jScrollPane.js 第82,83行，這是他真的會去做的事情。

        這裡的$this 指的是 div#myscrollbar.scroll-pane ，
        就是裡面真正裝東西的那塊。


79 $this.css('overflow', 'hidden');
80 this.originalPadding = $this.css('paddingTop') + ' ' +
        $this.css('paddingRight') + ' ' + $this.css('paddingBottom') + ' ' +
        $this.cs('paddingLeft');
81 this.originalSidePaddingTotal = (parseInt($this.css('paddingLeft')) || 0)
       + (parseInt($this.css('paddingRight')) || 0);
82 paneWidth = $this.innerWidth();
83 paneHeight = $this.innerHeight(); 


        基本上因為你的外層整個是隱藏的，所以他整個沒有所謂的寬高，
        這裡抓到的 width / height 都是 0 .


        所以當你顯示出來時，他的container 的width / height 都是 0，
        你就看不到正確的結果。


        這個問題假設你要一開始隱藏，顯示後又要對的話要動一點手腳，

        就是 show 完之後再去跑上 scroll panel  的行為，
        或者是反向思考，先上完這行為再hide。

        $('#myscrollbar').jScrollPane(
                {scrollbarWidth:20, scrollbarMargin:10});}


--
    I am a person, and I am always thinking .
    Thinking in love , Thinking in life ,
    Thinking in why ,  Thinking in worth.
    I can't believe any of what ,
    I am just thinking then thinking ,
    but worst of all , most of mine is thinking not actioning...

--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 111.82.114.94
推 swallowcc:唔啊,原來是這樣,真的是獲益良多<(_ _)>
→ swallowcc:其實我還一個Imageflow的程式也有這樣的問題...
→ swallowcc:看來應該是差不多的問題導致,明天睡醒再試著解看看:D
→ swallowcc:再次感謝,謝謝!
→ TonyQ:其實這類問題的標準處理SOP是 1. 先觀察兩者原碼的差異處
→ TonyQ:觀察 css 真實的差異處 （用firebug inspector)看，通常就會
→ TonyQ:有端倪可尋。如果能改css就處理的就改，如果是像這篇這種有
→ TonyQ:環境問題的。就去看plug-in source的進入點翻一下。
→ TonyQ:所以是三步驟 1.看html原碼 2.看css  3.看 js原碼
→ TonyQ:1,2 是找他哪裡不一樣 , 3 是找為什麼跟我想的不一樣
推 s25g5d4:3怎麼找阿...跨籠某
→ TonyQ:你看像他這種綁 context event 的，就是找 $.fn.extend 或
→ TonyQ:找 $.fn.xxxx =function(){}
→ TonyQ:以原po這個sample 你看 jScrollPane 第五十行就是進入點
→ TonyQ:剩下的就是 breakpoint 進去陪他逛一圈，通常就有解了
推 s25g5d4:進去陪她逛一圈勒...程式碼超過10行就懶的看了XDDDD
→ TonyQ:基本上plug-in 的結構很單純 邏輯就跟著進去轉轉看
→ TonyQ:-w-;;  這就是你的問題啦～
→ s25g5d4:XDDDD 哈哈
修一個錯字 XD
※ 編輯: TonyQ           來自: 111.82.114.94        (09/06 00:12)