WordPress.org

Ready to get started?Download WordPress

Forums

Infinite-Scroll
[resolved] [Plugin: Infinite Scroll] Can't get it to work! Problem with CSS Selectors? (2 posts)

  1. Danjiro
    Member
    Posted 2 years ago #

    Hello! I'm using WordPress 3.3 and trying to get infinite scrolling to work. Here is my code:
    For content div and article div

    <section id="products" class="container_12 clearfix">
            <div id="article" class="grid_4">
                <figure>
                    <h1><a href="#">test</a></h1>
                    <img src="img/article1.jpg" width="285" height="200" alt="product title" />
                    <figcaption>
                        <h2>test:</h2>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p>
                        <h3>test:</h3>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco</p>
                    </figcaption>
                </figure>
                <hr />
                    <div id="price" class="grid_2">
                        <h4><a href="#">$99.99</a></h4>
                        <p><a href="#">test</a></p>
                    </div>
                    <div id="buy-it">
                        <a href="#" class="button large orange"><span>test!</span></a>
                    </div>
            </div>

    #products should be the container and #article should be the container for each post right?

    for navigation selectors here is what I have

    <div id="navbelow" class="container_12 clearfix navigation">
            <div class="older-posts"><?php next_posts_link('Previous'); ?></div>
            <div class="newer-posts"><?php previous_posts_link('Next'); ?></div>
        </div>

    and my CSS

    /* @next-previous page navigation
    =======================*/
    
    #navbelow {
        margin-bottom: 10px;
        text-align: center;
    }
    
    #navbelow .older-posts, .newer-posts, .no-more-posts {
        display: inline;
        padding-right: 5px;
    }
    
    .navigation a, .navigation a:visited {
        color: #000;
    }
    
    .navigation a:hover {
        text-decoration: underline;
    }

    right now i have used #navbelow for Navigation css selector and .navigation a:contains(Previous) for previous post selector and tried a bunch of different combinations but all don't seem to work :( In fact, I don't even think the plugin or jquery is actually even loading...Is there anyway to check or any help? Thanks!

    http://wordpress.org/extend/plugins/infinite-scroll/

  2. Danjiro
    Member
    Posted 2 years ago #

    wow i got it to work for some reason...changed the post selector to .older-posts a:first which i had tried before and didnt work for some reason but it does now. sweet!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic