box con scrollbar in un pop-up

alessandromonti

Utente Attivo
25 Mar 2012
62
0
0
salve,
all'interno di un pop-up ho inserito un box con scrollbar...questo il codice

Codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<!--css scrollbar-->
<link href="malibu-scroller-bar/jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css" />
<link href="malibu-scroller-bar/style-malibu.css" rel="stylesheet" type="text/css" />


<!--css pop-up-->
<link href="pop-up/style.css" rel="stylesheet" type="text/css" />

<!--jquery scrollbar-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript" src="malibu-scroller-bar/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="malibu-scroller-bar/jquery.mousewheel.min.js"></script> 
<!--fine js scroller-->

<!--lo script del pop-up-->
<script type="text/javascript">
$(document).ready(function () {
$("#cliccaqui").click(function(){
$(".messaggio").fadeIn("slow");
$("#nero").css("display", "block");
$("#nero").click(function(){
$("#nero").css("display", "none");
$(".messaggio").fadeOut("slow");
});
$("#chiudi").click(function(){
$("#nero").css("display", "none");
$(".messaggio").fadeOut("slow");
});
});
});
</script> 
</head>

<body>
<div id="contenitore">

<!--link del pop-up-->
<div id="cliccaqui"><a href="#">my blog</a></div>

<!--lo sfondo del pop-up-->
<div id="nero">
</div>

<!--div messaggio: il box del pop-up-->
<div class="messaggio">

<!--struttura scrollbar-->
<div id="mcs_container">
<div class="customScrollBox">
<div class="container">
<div class="content">

<p><a href="#" onclick="LoadNewContent('mcs_container','dynamic_content.html');return false">Load new content dynamically</a></p>
<p>Lorem ipsum etc....etc.....</p>
</div>
</div>
<div class="dragger_container">
<div class="dragger"></div>
</div>
</div>
<a href="#" class="scrollUpBtn"></a> <a href="#" class="scrollDownBtn"></a>
</div>
<img src="pop-up/chiudi.gif" alt="Chiudi il popup" id="chiudi" />
</div><!--fine div messaggio: il box del pop-up-->
</div><!--fine div contenitore-->


<!-- se javascript è disabilitato-->
<noscript>
<style type="text/css">
#mcs_container .customScrollBox{overflow:auto;}
#mcs_container .dragger_container{display:none;}
</style>
</noscript> 


<!--script scrollbar-->
<script>
$(document).load(function() {
mCustomScrollbars();
});
function mCustomScrollbars(){

$("#mcs_container").mCustomScrollbar("vertical",300,"easeOutCirc",1.05,"auto","yes","yes",15);
}
/* function to fix the -10000 pixel limit of jquery.animate */
$.fx.prototype.cur = function(){
if ( this.elem[this.prop] != null && (!this.elem.style || this.elem.style[this.prop] == null) ) {
return this.elem[ this.prop ];
}
var r = parseFloat( jQuery.css( this.elem, this.prop ) );
return typeof r == 'undefined' ? 0 : r;
}
/* funzione carica nuovi contenuti */
function LoadNewContent(id,file){
$("#"+id+" .customScrollBox .content").load(file,function(){
mCustomScrollbars();
});
}
</script>
<script src="malibu-scroller-bar/jquery.mCustomScrollbar.js"></script> 
<!--fine script scroller-->

</body>
</html>

problema..lo scrollbar non scorre..solo se clicco sul link "Load new content dynamically" lo scrollbar va...dal poco che capisco non riesco a caricare la funzione dello scrollbar all'aprirsi del pop-up....che fare?

grazie
 
Ultima modifica:

Discussioni simili