Кнопки JQuery с возможностью прокрутки Next/Prev не могут быть заключены в другие теги

У меня есть прокручиваемый список: http://treethink.treethink.net/portfolio/

Я пытаюсь поместить тег p вокруг 2 тегов a, которые заставляют прокручиваемый элемент перемещаться вперед и назад, но независимо от того, что я помещаю вокруг тегов a, он прерывает прокрутку (span, div, p... Все они не работают )

Как я могу это решить? Я предполагаю, что это как-то связано с jQuery, участвующим в прокрутке.

Вот код для этого раздела страницы:

<div id="wrapper">

<div id="portfolio">

<div id="portfolio-main">

<div id="scroll">

<div class="scrollable">

<div id="thumbs">

<?php
   $pages = get_pages('child_of='.$post->ID.'&sort_column=post_date&sort_order=desc&parent='.$post->ID);

   $i = 1;
   foreach( $pages as $page ) {
       $content = $page->post_title;
       if( empty($content) ) continue;

       $content = apply_filters('the_content', $content);

       ?>

<div class="column" style="background: url(/wp-content/uploads/<?php echo $page->post_name ?>.jpg);">
<div class="desc"><a href="<?php echo get_page_link($page->ID) ?>"><h2><?php echo $page->post_title ?></h2></a><p><?php if(get_post_meta($page->ID, "date", true)) { echo get_post_meta($page->ID, "date", true); ?><br /><?php } ?><?php echo get_post_meta($page->ID, "desc", true); ?></p></div></div>

<?php $i++;

   }    ?>

</div>

</div>

<a class="prev banner-button">prev</a>

<a class="next banner-button">next</a>

</div>

<br clear="all" />

<script>

$(function() {      

    $("div.scrollable").scrollable({
        size: 4,
        items: '#thumbs',  
        hoverClass: 'hover'
    }); 

});
</script>

</div>

</div>

</div>

Вот стиль, в который я пытаюсь его обернуть:

#main-buttons{
    height: 30px;
    width: 560px;
    top: 460px;
    right: 0;
    position: absolute;
    z-index: 1;
    text-align: right;
}

И, наконец, вот файл jQuery, который включает прокручиваемый материал: http://treethink.treethink.net/wp-content/themes/treethink/scroll/jquery.tools.min.js

Спасибо, Уэйд.


scroll button jquery tags jquery-scrollable
person Wade D Ouellet    schedule 28.02.2010    source источник

Ответы (1)


arrow_upward
0
arrow_downward

попробуй это:

<div id='prevnext'>
    <a class="next portfolio-button">next</a>
    <a class="prev portfolio-button">prev</a>
 </div>

и это:

<script type="text/javascript">
$(function() {
    $("div.scrollable").scrollable({
        size: 4,
        items: '#thumbs',
        hoverClass: 'hover',
        next: "#prevnext .next",
        prev: "#prevnext .prev"
        });

    });
</script>

надеюсь на эту помощь.

person widyakumara    schedule 01.03.2010