Hello,

I am running into a problem on my website when the jQuery cycle plugin
is used with ui.tabs. When a portfolio item has multiple images, the
Cycle plugin is used for pagination. I chose this plugin since it's
easy to add a description / file links / web address and, I didn't
want image thumbnails so pagination is the best option.

http://www.petersurrena.com/

For example, this works but with multiple projects you end up with
multiple pager divs which overlap. Not good. It seems pointless to
create multiple pager objects, it would end up being a mess.
<div id="navpos">
        <div id="nav"></a></div>
</div>
<div id="wrt"> <-- Tab Div -->
        <div id="pager"> <-- Cycle Div -->
                <?php
                        include_once("portfolio/wrt.php");
                ?>
        </div>
</div>

This is ideal but does not work with webkit...ie and mozzila work
fine.
<div id="navpos">
        <div id="nav"></a></div>
</div>
<div id="pager"> <-- Cycle Div -->
        <div id="wrt"> <-- Tab Div -->
                <?php
                        include_once("portfolio/wrt.php");
                ?>
        </div>
</div>

here's the js
        <script type="text/javascript">
                        $(function(){
                        // Create pagination element
                        $('#pager').before('<div id="nav">').cycle({
                                fx:     'fade',
                                speed:  'fast',
                                timeout: 0,
                                pager:  '#nav',
                                cleartype:  1
                        });
                });
        </script>

Any idea on how to get the second option to work or is there a better
plugin to get the job done?

Reply via email to