Hi Zakir,

From a look at the code, you have set the settings of the slideshow to 'auto' and that's the most likely thing that's causing it. I can see you've set the image width and height correctly, now you also need to set the slideshow height and width to the same dimension as the images and not as 'auto'.

I just had the same issue and that's how I fixed it.

regards,
Joel

Joel it soesn't work... if u add attributes on image is not enough...i should give width and height to the widgetkit...but it won't work as responsive!! No solutions until now!!!!!!!!!!!!!!!!!!!!!!!!!

yootheme?? please answeeeer

Still not fixed...

YESSSSSS!! I've finally figured out how to fix this (mostly)

The trick is to not use "px" suffixeswhen setting width and height. Just use a number. In my case, I set width to 920 and height to 330. That much will get it to be responsive. That much will fix it for Chrome ... but not fully for Android Chrome on a small screen (EVO 4G LTE).

Sometimes, the Android Chrome version will work properly and sometimes not. Here is the condition under which it works:

It only works right after clearing the browser cache or navigating to the page from a different page. If you reload the page it will revert to a too-small viewport.

This is better than nothing but still not "fixed". Also If I were YooTheme, I'd either fix this bug or document the workaround on the page. Probably the best thing to do is filter out anything that's NaN.

@Joel,

Thanks again. I've removed the 100% styles which were another experiment.

I'm sorry it's taken so long to get back ... I've been busy on other projects. You know how it goes.

I'm receiving the same issue. I have a gallery set to "default" on a page in the TOP A position. Whenever I click the home logo, and then go back to the page, the slideshow only shows about 1/3 of the image.

same problem as zakir.patrawala
Nano 2
Chrome 21.0.1180.60 m

guys, vote for that issue...

+1 Same thing in Chrome happening to me intermittently?

I removed the line "#top-b:after," because I have the module set to top-b at styles/header/css/layout.css

/* Block Separators */  
#top-a:after,  
#top-b:after,  
#innertop:after {  
    content: "";  
    display: block;  
    margin: 0 20px;  
    border-bottom: 1px solid #ddd;  
}

Then went to css/custom.css and added:

#top-b div.module {  
margin: 0;    
}

I'm getting the full height now but I'm not getting the slideshow to display. Chrome is popping out this error:

Uncaught TypeError: Object [object Object] has no method 'slideshow' widgetkit-a0c21172.js:15

I deleted the cache by hand and through ssh to let it rebuild, the problem still exists. It also happens in Safari.

Actually, I noticed today that the problem exists in Firefox as well. This is really frustrating. It completely makes this part of WidgetKit useless.

There has been absolutely no movement on this in over two months???

Is this normal for YooTheme support? I was going to use the themes, the Zoo toolkit and the WidgetKit on my sites but if this is what I should expect, I'm totally going to dump them. Where else other than the main Joomla repository are there review sites?

Is anybody else using another widget that they like to replicate this functionality??

Hi Frank,

I think the best way would be setup a template + widgetkit which shows the problem then it will be easier for YOOtheme to reproduce the issue . I've done that in a couple of similar issues with widgetkit and they've responded (well, most of them.) But for the life of me, I'm not able to reproduce your issue. I hope they will. I've used widgetkit in all my themes (both in mobile and desktop) and I no longer get that issue
All the best.
regards

There are two ways to solve this issue in my experience (which has been a very stress filled one), but I have managed to find inner peace by taking the following steps.

Firstly if you have a problem with a slideshow that is loading fixed size content (i.e not width:100%; in css) then the way I solved it is to copy the style on the slideshow widget I was using and create a new style by changing the xml file and name of the folder. Then in the template php file within that style hard code the height and width into the UL tags of the template, this will mean the slideshow always loads correctly to the right height and width.

The second issue is on a variable slideshow, (with width:100% or auto widths for example). The way to do this is to code in a max-width and max-height into the css pointing at the slideshow outer div. This I've found makes the slideshow always loads correctly, up till now, let me know if this works for you.

I had this problem on Chrome mobile (Android). The slideshow was collapsed most of the time. I added the following to the page to fix:
WidgetKit 3.5 (Jan 2013) did not fix it either.

<script>window.setTimeout(function(){$('.slides').height($('.slides img').height());},1000)</script>

Seems to have taken care of it.

I figured out a temporary (or perm fix). You have to specify a height and width in the players settings. You can't leave it on "auto".

Height of the SlideShow widget ? When I do that it leaves lots of extra space on iPhone where the width is auto adjusted because of responsive design but the height is not.

Thanks

Hi Zakir,

I had same problem with my theme. You need to add the correct width and height attributes to your images (as suggested by artur) that matches your slideshow settings. For instance: if your slideshow is 900px by 400px also set the width and height of the images to be the same

<img src="images/myimage.jpg" alt="slide" width="900" height="400" />

regards,
Joel

Hi Joel

I tried adding width and height in image but it did not fix. Remember the problem occurs in Chrome only. You can see here

And after the initial page load if you click on the Logo to load the page again, the problem disappears.

Thanks

Great, thank you Joel!!!

I have exactly the same problem. Manually matching height and width does not solve the problem for me.

I have also same problem...i think yootheme has to find a fix for the javascripts files... only chrome did it!!

+1 I have the same problem. Actually I have a lot of issues with WidgetKit. This being just one. As Gaetano said, if you supply image dimensions, it ruins the responsive properties of the theme.

So ... yeah it isn't fixed yet.

Problem still exists!!!! Someone should comunicate the bug to chrome cause other browsers are working well!!!!

Hi @Frank @Gaetano @Jude,

Did you set the slideshow settings as well as the image dimensions to be of the same dimension. Send me an email to support at arrowthemes dot com and I can have a look at your site.

@Joel

Thanks for your answer and the fact that you keep working on trying to help with this issue!

The problem isn't that I can't get it to display - it's that if I set dimensions for both the images and the slideshow, it wrecks the responsiveness of the slideshow. Meaning that if you go to fbomb-dance.com in a regular browser - it now works using Chrome, Firefox or what have you ... except for mobile. When looking at the same website through Android or iOS phones, you'll see that the slideshow now has a fixed 330px height and tiny photos. The tiny photos are expected - that's not the problem. The problem is the humongous black margin below the photos.

Thanks again Joel!

Hi Frank,

I try to help where I can. When I view the browser console, I've notice you've set the width of the slide-settings to 'auto' . Set it to 920px and test if the black margin goes away.

regards

Thanks again Joel,

Unfortunately, it worked as expected. ie. It broke the responsiveness of the slideshow. Any small screen now only shows a portion of the image. (which is admittedly slightly better than a large bottom border). It still can't be used properly with iOS or Android or Netbooks.

Thanks anyways!

@Frank,

Something still seems wrong on your images. You've got a width=100% which I don't seem to like. It could be what's causing the lack of responsiveness. Could you paste the html code that you have in your article section of one slide?

Same problem her:-(
Using Joomla 2.5.7 with a twitter bootstrap template and widgetkit 1.2.2
Trying to put a slideshow in the header postion but the height of the slideshow fails to show in Chrome (only a little portion of it).

Seen a lotta question about it here but still no solution.

Bought widgetkit 1.2.2 in the hope this update solved the problem but the problem remains!!!!

Why does Yootheme have a support button on the website but don't support these kind of bugs?

@sitemoves - take a look at my post right before yours for a working solution. It's not perfect but it's better than nothing!

Hi Frank,

That's what I did but it is not the perfect solution;-)
I think Yootheme has to come up with "THE" soltion.
If they don't, I have to look for another extension.

SlideShow widget have this issue... a simply respond from Yootheme like "Ok Guys we notice this problem and working for the solution" is very relief than point fingers to us (customer) that there's something wrong with out website... In IE8, there's even more problem, i "pushed" the support team 'hard' question, and i took the hard replied as well :

"You may indeed have made the worst decision of your life, but that is what you can expect if you want to use modern tools to develop for IE 8." - mustaq (5 October 2012)

I came to the point where even yootheme's support team does not have the solution for this... But i believe the core yootheme team will inovate, i see how's the code structure and it made by professional... so as for now, you need to be patience for the solution...

@sitemoves - I agree!

I do suspect thought that we should create a new thread with the same kind of question. The OP marked this thread as already answered so YooTheme staff may be writing it off and not bothering to look at it anymore...

Wow. Seriously? Somebody has gone through and voted down almost everything I wrote lately? What kind of forum is this?

Good idea Frank - I have posted a new question in the hope that this gets some more attention. ref. SlideShow widgetkit does not adjust height properly in Tasty/Joomla on Chrome