Podeis verlo en este link.
Este es el codigo que tengo:
Código HTML:
Ver original
<div id="glosario"> <?php $categories = get_categories('child_of=100&hide_empty=0'); foreach ($categories as $category) { //Display the sub category information using $category values like $category->cat_name echo '<ul>'; $posts = get_posts(array('cat' => $category->term_id, 'order' => 'ASC', 'post_type' => 'glosario', 'showposts' =>-1, 'post_status' => 'publish,future,draft')); foreach ($posts as $post) { } echo '</ul>'; } ?> <div id="scrollablemenu"> <?php $cats = get_categories( 'child_of=100&hide_empty=0'); foreach ($cats as $cat) { echo '<a href="#' . $cat->cat_name . '" class="scrollablemenubutton" class="scroll" onclick="jQuery(\'body\').scrollTo(\'#' . $cat->cat_name . '\', 1000);">' . $cat->cat_name . '</a>'; } ?> </div> </div>
Código CSS:
Ver original
#glosario .stick { position:fixed; right:500px; }
Código Javascript:
Ver original
jQuery(document).ready(function() { var s = jQuery("#scrollablemenu"); var pos = s.position(); jQuery(window).scroll(function() { var windowpos = jQuery(window).scrollTop(); if (windowpos >= pos.top) { s.addClass("stick"); } else { s.removeClass("stick"); } }); });
Haber si alguien puede echarme una mano, el javascript no es lo mio.
Gracias de antemano a tod@s!