jquery - CarouFredSel Flashes When Scrolling Next in Safari -

jquery - CarouFredSel Flashes When Scrolling Next in Safari -

i working on website uses caroufredsel display vertical scroller (http://new.joshrodg.com/?page_id=206), problem i'm having when click previous button, caroufredsel scrolls fine...but when seek , advance slideshow clicking next button scrolling messed up....and odd thing happens when have posted google map using wordpress mappress plugin.

i pretty sure mappress plugin causing issue, think code can fixed (especially since seems safari-only issue...i've tested in safari, firefox, chrome, , ie8)

now 1 thing did work (somewhat) adding position: relative .sidebar-image a css style, problem although advances correctly, there no scrolling effect (which defeats purpose)

anyone ever experienced before?

my script looks like:

$(window).load(function() { /* sidebar */ $("#sidebar-image").caroufredsel({ direction: "up", auto: false, items: { visible: 2 }, next: "#down", prev: "#up", scroll: { easing: "quadratic", items: 1 }, width: "100%" }); });

my code looks like:

<div class="sidebar-image"> <div id="sidebar-image"> <?php while ( have_posts() ) : the_post(); ?> <?php if ( has_post_thumbnail() ) { ?> <?php $id = get_post_thumbnail_id(); $url = wp_get_attachment_image_src($id, "large", true); ?> <a href="<?php echo $url[0]; ?>" rel="lightbox[<?php echo get_the_id(); ?>]"><?php the_post_thumbnail("sidebar-image"); ?></a> <?php } ?> <?php endwhile; ?> </div> <div class="clear"> <!-- --> </div> </div>

and css looks like:

/* slides */ .sidebar-image { border-bottom: 1px solid #dcdedf; overflow: hidden; width: 277px; } .sidebar-image { border-left: 1px solid #dcdedf; border-right: 1px solid #dcdedf; border-top: 1px solid #dcdedf; display: block; position: relative; float: left; }

all of code in div has relative position - read somewhere that cause problem, after removing css carousel still same thing...

the code containing div looks like:

/* slideshow */ #sidebar { float: right; position: relative; width: 305px; }

i have tried using different jquery library (the 1 straight jquery, opposed 1 straight google). have tried using the total caroufredsel script, opposed using caroufredsel packed version.

any ideas? it's got me stumped :-(

thanks, josh

i can confirm google maps issue , has nil code using caroufredsel...i have tried several google map plugins wordpress , crazy scrolling happens regardless of plugin.

so, here's did...instead of using google maps plugin called: "mappress", using mapquest plugin called: "mapquest map builder wordpress"

now, on post or page map caroufredsel code works without glitch or error :-)

yay!

thanks, josh

jquery google-maps safari scroll caroufredsel