La finalidad de este es que permite que el sidebar quede fijo y cuando uno baja con el scroll el sidebar baja con este, para que se hagan una mejor idea veanlo en la página del desarrollador
Pues bien, yo estoy haciendo una plantilla con algunas variantes para que el sidebar se muestre a la derecha o a la izquierda, quisiera que este efecto se muestre en alguno de ellas pero no me resulta. Quisiera pedirles si me pueden dar una mano
Tengo esto hecho y no me funciona
Código HTML :
<!-- estilos portamento-->
<style>
.container {overflow: hidden;}
.portamento_container {position:absolute; right:0; top:0;} /* take the absolute positioning of the sidebar */
.portamento_container #cols {}
.portamento_container #cols.fixed {position:fixed; right:auto; top:auto;} /* become fixed position, but reset the top and right values */
</style>
</head>
<body>
<div class="container">
<!-- Comienzo Header -->
<div id="header" class="span-24">
<!-- Comienzo Logo -->
<div id="logo" class="span-9">
<a href="<?php echo $this->baseurl ?>" title="<?php echo $app->getCfg('sitename'); ?>">
<h1><?php echo $app->getCfg('sitename'); ?></h1>
</a>
<h2 id="eslogan">
<?php if($eslogan) : ?>
<?php echo $eslogan; ?>
<?php else : ?>
Artesanía decorativa para niños
<?php endif; ?>
</h2>
</div>
<!-- Fin Logo -->
</div>
<!-- Fin Header -->
<!-- inicio menu principal-->
<div id="menup" class="span-24">
<?php if($this->countModules('menup')) : ?>
<div id="menup">
<jdoc:include type="modules" name="menup" style="none" />
</div>
<?php endif; ?>
</div>
<!-- fin menu principal-->
<!-- Mensajes del CMS -->
<jdoc:include type="message" />
<!-- Maquetación a una columna -->
<?php if($maquetacion == 1) : ?>
<!-- Comienzo Contenido principal -->
<div id="contenido" class="span-23">
<jdoc:include type="component" />
</div>
<!-- Fin Contenido principal -->
<!----------------maquetación a 3 columnas---------------------------------->
<?php elseif ($maquetacion == 3): ?>
<!-- Comienzo Columna derecha -->
<div id="cols" class="col span-6 last"> <!-- ESTA VENDRÍA HACER EL SIDEBAR QUE QUIERO QUE QUEDE FIJO -->
<jdoc:include type="modules" name="cols" style="personalizado" headerLevel="3" />
</div>
<!-- Fin Columna derecha -->
<!-- Comienzo Contenido principal -->
<div id="colp" class="col span-16">
<jdoc:include type="component" />
</div>
<!-- Fin Contenido principal -->
<!-- Maquetación a dos columnas -->
<?php else : ?>
<!-- Comienzo Contenido principal -->
<div id="columna_izquierda" class="col span-16">
<jdoc:include type="component" />
</div>
<!-- Fin Contenido principal -->
<!-- Comienzo Columna derecha -->
<div id="columna_derecha" class="col span-6 last">
<jdoc:include type="modules" name="columna_derecha" style="personalizado" headerLevel="3" />
</div>
<!-- Fin Columna derecha -->
<?php endif; ?>
<!-- Comienzo Footer -->
<div id="footer" class="span-24">
<div id="legal" class="prepend-3 span-9">
©<?php echo date('Y'); ?> <?php echo $app->getCfg('sitename'); ?>
</div>
</div>
<!-- Fin Footer -->
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="/js/portamento.js"></script>
<script>
$('#cols').portamento({wrapper: $('.container')}); // set .wrapper as the bottom boundary
</script>
</body>
Alguna idea de que debo modificar para que funcione?
Gracias
