The version (1.2.0) lacks the size option Created May 6, 2010

Please read about the crucial change in the new scrollable:

http://flowplayer.org/tools/release-notes/1.2.0/index.html

I just notice that size was removed, but it was tooo useful-

For example in Wordpress:

I use a loop to show my post in scrollable, so every post content starts automatic with <div>

so I got hundreds of post that are scrolling one by one....

#sizenecesary lol

but if you have a very good idea how to fix this issue like in wordpress, would be great:

my sample code:

<div id="carruselWrap">
<h2><?php echo get_option('yh_carrusel_title'); ?></h2>

<!-- "previous page" action --> 
<a class="prev browse left"></a> 

<!-- root element for scrollable -->
  <div id="carrusel">	
        
                <!-- root element for the items -->
                <div class="items">
                
        
                        <?php $my_query = new WP_Query('cat=6&showposts=25p&orderby=id&order=asc'); ?>
                        <?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
                        <div>
                        <?php the_post_thumbnail(); ?>
                        <h1 class="other-item"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
                        </div>
                        <?php endwhile; ?>
                                                                                                    
                </div>
        
        </div>

<!-- "next page" action --> 
<a class="next browse right"></a>
        <!-- wrapper for navigator elements -->
<div class="navi"></div>
</div>
<br clear="all" />

	
</div>

ok I manage to make work 1.2.1 scrollable without size (#sizenecessary).

With the help of Wordpress.org forum support ...


to add page class I use:

<?php $my_query = new WP_Query('cat=6&showposts=24p&orderby=id&order=asc'); $c = 0;?>
                <?php while ($my_query->have_posts()) : $my_query->the_post(); $c++;?>
                <?php if( $c == 1) echo '<div class="page">'; elseif ($c == 6) echo '</div>';?>
                <?php if( $c == 6) echo '<div class="page">'; elseif ($c == 12) echo '</div>';?>
                <?php if( $c == 12) echo '<div class="page">'; elseif ($c == 18) echo '</div>';?>

so #SIZENECESSARY

I'm having a hard time understanding how no size option is better. Maybe if it were optional, fine, but to remove it requires many of us to create even more complicated scripts to try and lump items into "pages" (sub items?) in order to maintain existing 1.1.2 functionality.

Also, whatever code is "detecting" the containing div size vs the item size is apparently flawed, perhaps in the way it calculates size with padding and margins. As a result, when using the circular option, some items do not become duplicated until AFTER then should have been visible causing some to flash on the screen after the animation is done. I suppose again this can be fixed with the complicated paging method but then im writing out more than twice as much code as i needed to get 1.1.2 working so i dont think its worth the upgrade.

Paging becomes even more complicated when the number of items variues due to content from a CMS being used to generate them.

Tero, the problem is the new scrollable doesn't allow you to show multiple items at a time but only scroll one item at a time (rather than group by pages)... without some buggy side effects:

- with circular false, you can scroll all the way to the end and keep scrolling until your last element is first in view, with blank space to the right.

- with circular true, you get all sorts of strange things happening, elements disappearing and reappearing.

Exactly the same problems here, only they are fixable by creating "pages" of content, basically putting X number of items inside a larger item so only one shows at a time. This is how the documentation says to do it, but we lose the ability to have lets say 10 items visible and only move forward by 1 of those items at a time. If you were to try this, it would cause odd problems as Hainesy said with circular.

Besides this, OnBeforeSeek is firing as soon as the script loads making my fade effects go crazy.

Thank you very much for your comments (Tero and Locke), certainly in http://flowplayer.org/tools/release-notes/1.2.0/index.html resolve all my doubts about this version.

Total Thanks!

What's the resolution?

The number of elements and is not changed "size" because it removes the version 1.2.0, in this case are used img as many want to display images, a possible solution would be:

<!-- Code HTML -->
<hr>
<a class='prev left'> browse </ a>
<div class='scrollable' id='id_scrollable'>

    <!-- Root element for scrollable items -->
    <div class="items">

        <!-- Page # 1 -->
        <div class="page">
            <div>
                <img src="http://faarm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg">
                <img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg">
            </div>
        </div>

        <!-- Page # 2 -->
        <div class="page">
            <div>
                <img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg">
                <img src="http://farm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg">
                <img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg">
                <img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg">
            </div>
        </div>

        <!-- Page # 3 -->
        <div class="page">
            <div>
                <img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg">
                <img src="http://farm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg">
                <img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg">
                <img src="http://farm1.static.flickr.com/79/244441862_08ec9b6b49_t.jpg">
                <img src="http://farm1.static.flickr.com/143/321464099_a7cfcb95cf_t.jpg">
                <img src="http://farm4.static.flickr.com/3089/2796719087_c3ee89a730_t.jpg">
            </div>

        </div>
    </div>
</div>

<a class='next right browse disabled'> </ a>

<br clear='all'>
<hr>
<!-- End HTML -->

<!-- jQuery Code -->
    $("#id_scrollable").Scrollable();
<!-- End jQuery -->

To set the number of pictures for each "page" is done by including in the <div class="page"> for the previous example used three pages and each is used 2, 4 and 6 images respectively.

As shown in paragraph "A brand new Scrollable" inhttp://flowplayer.org/tools/release-notes/1.2.0/index.html