ポップアップボックスのJscrollpaneプラグインの問題

jscrollpane jqueryプラグインを使用して、ポップアップdivボックス（略してライトボックス）に適用されますが、jscrollpaneスクロールバーが表示されません。ここでポップアップボックスのJscrollpaneプラグインの問題

{ 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">                 
<head>                 
<script src="http://code.jquery.com/jquery-1.4.4.js"></script> 
<link type="text/css" href="style/jquery.jscrollpane.css" rel="stylesheet" media="all"></link> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="JScrollPaneScripts/jquery.mousewheel.js"></script> 
<script type="text/javascript" src="JScrollPaneScripts/jquery.jscrollpane.min.js"></script> 
<link rel = "stylesheet" type = "text/css" href = "sample1.css"></link>   
<script type="text/javascript"> 
$(document).ready(function() 
    { 
    $(function() 
    { 
    $('#testing2').jScrollPane(); 
    }); 

    $("#testing").click(function() 
    { 
    $("#testing2").show(5000); 
    }); 
    }  
);  
</script> 
</head>                 
<body> 
<div id = "wrapperdiv"> 
    <a id = "testing" href="#">Link</a> 
    <div id = "testing2"> 
    lksjflksjdlkflskdjflksjdflkjslkjdflk 
    lsdkflksjgliowtjlskdfjlskdfjlskgs 
    lksjlk,.x,cmlkvjlkjlwkeoltklfnjsklkj 
    lksjf.m,.jlkjoliwekjtlkjgkjjlkjlkjll 
    llvalkiwujoitjlkgskjdkgjlsd,fjlsllll 
    lksjflksjdlkflskdjflksjdflkjslkjdflk 
    lsdkflksjgliowtjlskdfjlskdfjlskgs 
    lksjlk,.x,cmlkvjlkjlwkeoltklfnjsklkj 
    lksjf.m,.jlkjoliwekjtlkjgkjjlkjlkjll 
    llvalkiwujoitjlkgskjdkgjlsd,fjlsllll 
    lksjflksjdlkflskdjflksjdflkjslkjdflk 
    lsdkflksjgliowtjlskdfjlskdfjlskgs 
    lksjlk,.x,cmlkvjlkjlwkeoltklfnjsklkj 
    lksjf.m,.jlkjoliwekjtlkjgkjjlkjlkjll 
    llvalkiwujoitjlkgskjdkgjlsd,fjlsllll 
    lksjflksjdlkflskdjflksjdflkjslkjdflk 
    lsdkflksjgliowtjlskdfjlskdfjlskgs 
    lksjlk,.x,cmlkvjlkjlwkeoltklfnjsklkj 
    lksjf.m,.jlkjoliwekjtlkjgkjjlkjlkjll 
    llvalkiwujoitjlkgskjdkgjlsd,fjlsllll 
    lksjflksjdlkflskdjflksjdflkjslkjdflk 
    lsdkflksjgliowtjlskdfjlskdfjlskgs 
    lksjlk,.x,cmlkvjlkjlwkeoltklfnjsklkj 
    lksjf.m,.jlkjoliwekjtlkjgkjjlkjlkjll 
    llvalkiwujoitjlkgskjdkgjlsd,fjlsllll 
    </div> 
</div> 
</body>                 
</html> 
}

CSSされています：

* 
{ 
padding: 0px; 
margin: 0px; 
} 

#wrapperdiv 
{ 
width: 1000px; 
margin: 500px auto 0px auto; 
} 

#testing 
{ 
width: 100px; 
height: 50px; 
border: 1px solid; 
font-size: 22px; 
display: block; 
text-align: center; 
padding: 25px 0px 0px 0px; 
} 

#testing2 
{ 
display: none; 
width: 270px; 
height: 300px; 
background: yellow; 
border: 1px solid; 
bottom: 100px; 
left: 10%; 
position: relative; 
z-index: 999; 
}

出典

2011-01-29 dave

を、それを使って説明していますjScrollPaneは、初期化すると目に見えない項目では機能しません。これは、それが意図されているサイズを計算できないためです。ですから、この例のようにコンテンツを表示した後にJScrollPaneを再初期化する必要があります。

http://jscrollpane.kelvinluck.com/invisibles.html

コールバックはあなたが交換することができますjQuery showの2番目のパラメータとして提供することができます。

$("#testing2").show(5000);

で：

$("#testing2").show(
    5000, 
    function() // callback function 
    { 
     $('#testing2').jScrollPane(); 
    } 
);

補足として、=の周囲のスペースは、おそらくHTMLから検証中...

出典

2011-01-29 19:25:36 vitch

みんなありがとう、私はそれを感謝しています。 – dave

いくつかのことを試して：私が正しくリコール

は、要素はCSSプロパティ

overflow:auto;

を持っている必要があります。ここhtmlがあります

が適用され、＃testing2のためにあなたのCSSに貼り付けられます

問題ので、あなたがショーの機能の後にスクロールを初期化しようとすることができて、あなたのターゲットが隠されている要素：それがうまく動作するかどうかを確認するために隠された要素なし

$(document).ready(function() { 

     $('#testing').click(function(){ 

      $('#testing2').show(5000, function(){ 
       $('#testing2').jScrollPane(); 
      }); 

     }); 

    });

してみてください。

また、これらのリンクをチェックしてください - ここcomment5：http://code.google.com/p/jscrollpane/issues/detail?id=30

This ('#myDiv').show().jScrollPane() fix worked perfectly for me.

私の上記のコードは

$(document).ready(function() { 

    $('#testing').click(function(){ 

     $('#testing2').show(5000).jScrollPane(); 

    }); 

});

とhttp://jscrollpane.kelvinluck.com/invisibles.htmlになる。その場合には - invisble要素に

出典

2011-01-29 19:24:02 tbwcf

スナップ！私が行う唯一の訂正は、アイテムがまだ隠されている間に再初期化が行われるため、ショー機能に遅れがある場合、ショー後の再初期化を連鎖することはできないということです。 – vitch

ええ、 - 参照欄がどっちになっているかのようでしたが、そのような場合に遅延があると言うと、スパナが動作します。私はデイブは実際にも .fade（5000）ではなく、ショーを意味し、私は何デイブはacutallyを意味するとフェードイン（5000）である推測推測 - というよりもショー（500）も – tbwcf

ポップアップボックスのJscrollpaneプラグインの問題

答えて

関連する問題