Another plugin might be causing the issue. Could you try to deactivate all plugins one by one, and see if one of them conflicts with Jetpack Carousel?
The result persists with all plugins (besides jetpack) disabled.
I have a screenshot with the debug frame open.
Edit:
The selected carousel has a computed style of “top: 573px;”
<div class="jp-carousel-slide selected" style="position: relative; left: 0px; width: 1023px; height: 767px; top: 573.8249999999999px; -webkit-transform: translate3d(441px, 0, 0);"><img src="http://guiltyxindoc.com/media/P1011355.jpg"></div>
When switching to a different theme like Twenty Twelve, do you still see the extra margin?
No, it is not replicated in TwentyTwelve.
But my theme does not have any rules that should override the styling of the carousel.
Any idea why Jetpack is creating an inline top offset that is so large? I can’t figure out what sets off this behavior. The style is inline, so there is no way for me to override it, either (without hacking through JS of course).
The only things I can think of are:
1) An element that affects the slide’s flow (which there shouldn’t be)
or
2) Something is tricking the javascript into thinking the viewport is larger than it really is.
3) Aliens.
Although the Alien theory makes sense, I’d vote for some extra Javascript in your theme. I looked around but couldn’t find anything that could cause the problem.
I’ll ask someone else to have a look, and we’ll keep you posted. In the meantime, could you try to delete Jetpack and reinstall it, just in case the issue might be caused by some incomplete Jetpack files?
I commented out any queued scripts (there was only one) in my functions.php. I also commented out the enqueue of jQuery in header.php.
I just tried a reinstall of the Jetpack plugin, and no dice.
It seems we found a solution!
Since you didn’t set any doctype in the HTML, when javascript looks for the window height, it returns the document height, which is much taller and causes top to get set to a much higher value.
Could you add a doctype to your theme?
<!DOCTYPE html>
Can you tell me how to change the width of the tiled gallery and slideshow? Would like to increase it to 100%.Thanks.
The Galleries will use the entire width of your content area if you define a $content_width value for your theme.
Try adding the following code to your theme’s functions.php file:
if ( ! isset( $content_width ) )
$content_width = 600;
Of course, you will have to change that value to match your own theme’s content width.
It seems we found a solution!
Since you didn’t set any doctype in the HTML, when javascript looks for the window height, it returns the document height, which is much taller and causes top to get set to a much higher value.
Could you add a doctype to your theme?
<!DOCTYPE html>
Thanks, Jeremy. I feel silly.
Any idea why the images in carousel are larger when viewing from a tablet in portrait mode?
It doesnt affect use too much, but I’ve been wondering why.
And are there any resources for theme developers to make sure their themes support Jetpack functionality?
Regards.
Any idea why the images in carousel are larger when viewing from a tablet in portrait mode?
@indoctrinated Would you mind posting a link to a screenshot here, so I can have a look?
And are there any resources for theme developers to make sure their themes support Jetpack functionality?
You can find some information and help about each module here:
http://jetpack.me/support/
The landscape doesn’t fill like the portrait does, and gives the impression of being larger.
Thanks for the screenshots, it helps.
Since the Carousel is built to show the description below the image, your images will always be resized to give some space to the description. If you were to make the images bigger in the landscape view, the title would disappear.
I’m having difficulty with the Jetpack Carousel only when galleries are inserted on pages, not posts. It works perfectly on my posts. But on pages the images are not sized into the standard tile format and are in a variety of sizes. There is an example at the bottom of this page. http://prtcdressage.com/?page_id=2 In addition, when I am creating the gallery, I only have 2 options, default and slideshow, not “tiles” “circles” etc. And on the WP Dashboard Settings: Media page, the only image carousel options I have are background color and whether or not to show metadata, but cannot “set to cool mosaic tiles” as the information in my jetpack carousel settings say I should. Any suggestions? Thanks very much.
