Hola gente de foros del web, estoy teniendo un problema y quería saber si alguien sabe como solucionarlo:
Subi una pagina de test para que puedan apreciar el problema: http://granjalaaurora.com/test/test-jscrollpane.html
Estoy usando jscrollpane* para modificar las barras de desplazmiento y necesito que cargue dentro de la sección about (y en las otras secciones también) Creo que tengo que reiniciar jscrollpane despues de cada .fadeIn() en el script site.js pero no logro conseguirlo.
* http://jscrollpane.kelvinluck.com/#examples
El script del menu es el siguiente:
Código PHP:
$(document).ready(function() {
// load all links in a new window
$('p a').each(function(){
$(this).attr('target','_blank');
});
// the currently loaded section
var curLoaded = 'about';
// start by showing the about us section
$('#contentContainer').animate({
height: 350
},"slow", function(){
// fade in the content
$('#' + curLoaded).fadeIn();
});
// navigation trigger
$('#navbar a').each(function() {
var $this = $(this)
var target = $this.attr('href').split('#')[1];
var $contentContainer = $('#contentContainer');
var oldPos = 60;
var newPos = 350;
// add a click handler to each A tag
$this.click(function(){
// if the container isn't open, then open it...duh!
if ($contentContainer.css('height') == '60px') {
// trigger the animation
$contentContainer.animate({
height: newPos
},"slow", function(){
// fade in the content
$('#' + target).fadeIn();
});
} else {
if (curLoaded == target) {
$contentContainer.animate({
height: oldPos
},"slow", function(){
$('#content div').hide();
});
} else {
$contentContainer.animate({
height: oldPos
},"slow", function(){
$('#content div').hide();
$contentContainer.animate({
height: newPos
},"slow", function(){
$('#' + target).fadeIn();
});
});
}
}
curLoaded = target;
return false;
});
});
// remove the focus lines
$('a').focus( function() { $(this).blur(); } );
});
Un par de aclaraciones más, estoy usando dos versiones de jquery porque el script del menu no funciona con otra version que no sea la 1.2.1, pero estoy usando noconflict y no creo que sea eso.
Segundo estoy ejecutando jscrollpane dentro de una etiqueta <h2> porque no puedo incluir divs dentro del div "#content" debido a esto: $('#content div').hide();
Eso es todo, cualquier ayuda será muy bienvenida y agradecida