views:

2080

answers:

2

I'm looking to get some help on using the cycle library for jQuery. I'm in the beginner demos, and I got the absolute first one completed. This is the second one on the page.

<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="jquery.cycle.all.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {

    $('.pics').cycle({
        fx:      'scrollDown',
        speed:    300,
        timeout:  2000
    });
</script>

My CSS is identical to the one on the page, that's why I put .pics in the quotes.

+2  A: 

I will take a guess that this is just not working for you.
You need to balance your braces and parentheses.
Please help others to help you by saying what the actual problem is next time.

Try this:

$(document).ready(function() { 
    $('.pics').cycle({  
        fx: 'scrollDown',     
        speed: 300,     
        timeout: 2000 
    });
});
seanb
A: 

Is it OK to re-open this question? It's working OK but I'm having a rough time styling this. I'm trying to make images float left, and text wrap around it to the right like in the demo (non image content).

My script is:

<script type="text/javascript">

$(document).ready(function() {
    $('.text')
    .before('<div id="slidenav">')
    .cycle({
        fx:     'fade',
        speed:  'slow',
        timeout: 6000,
        pager:  '#slidenav',
       pause: 1
    });
});

</script>

...

<div id="featured">
    <div class="text">
        <txp:article_custom form="slidetext" section="slide" limit="5" />
    </div>
</div>

and my CSS is:

.text { width: 600px; height: 200px; border: 1px solid #ddd; background-color: green; }
.text div { width: 500px; height: 200px; padding: 15px; color: #333; text-align: left; font-size: 16px; background-color:red; }
.text div img {width: 200px; height: 200px; padding: 3px; background: orange }
.text div p{ background-color:black;}

Sorry there is no float properties here, because none of them were working. I grabbed that CSS off the jQuery cycle demo page.

And the outcome is

http://img147.imageshack.us/img147/4434/jqueryhelpdl5.jpg

http://img147.imageshack.us/img147/4434/jqueryhelpdl5.jpg