SOLVED RokGallery Vertical Thumbnails Chrome and Safari
-
-
- SurfStarMedia
- Jr. Rocketeer
- Posts: 39
- Thanks: 1
- We're Not Models
-
Hello!
I’m having an issue with the RokGallery slideshow thumbnails in Chrome and Safari (works in Firefox). Not sure if it’s a template specific problem.
I have a photography page which displays 3 RokGallery module slideshows. In Chrome, the top and bottom slideshows look fine, however the middle slideshow displays two vertical columns of thumbnails (rather than horizontally under the main slideshow image like normal). In Safari, the top slideshow looks fine, but the middle and bottom have the vertical thumbnail problem. As I said, the slideshows seem to load fine in Firefox.
If I turn on Autoplay, once the first image rotates, the vertical thumbnails fall into place horizontally as they should. If Autoplay is turned off, the thumbnails will stay vertical until you click an arrow- then the thumbnails move to the correct horizontal position.
In short, these vertical columns only last 8 or 9 seconds, once autoplay starts, but that’s long enough for people to scroll down and see them. Pretty ugly and confusing- also makes the webpage really long until they go back to horizontal.
Each gallery has 16 images each (not a ton). I’m using the Fracture template. Latest version of Joomla (3.4.
, and everything is up-to-date, including RokGallery.
I’ve attached some screen shots and here’s a link to the page:
http://www.swhammond.com/artwork/photography
Thank you! - Last Edit: 9 years 3 months ago by SurfStarMedia.
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13484
- Web Designer/Developer
-
The issue is that your are loading 9.4MB of images on that page and they take a long time to download. until that has completed the css/js has not kicked in. If you actually wait you will see that the page does correctly show. So, you need to reduce the size of the images (filesize) and/or use a compressor (such as rokbooster). Rokbooster has to be tuned to your particular environment and extensions - this is not something we can do for you as part of this support forum. I encourage you to read the rokbooster documentation to learn how to add exclusions and change the many other settings in rokbooster. Once tuned rokbooster will speed up your site so it's worth the effort.
I don't know what safari you are using but... we don't support Safari for windows at all (neither do Apple).
Regards, Mark. - Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
-
-
- SurfStarMedia
- Jr. Rocketeer
- Posts: 39
- Thanks: 1
- We're Not Models
-
Hi, MrT!
Thanks for getting back with me!
Thanks for pointing out that the page is rather large- I'll need to do something about that.
So you can see, I have disabled autoplay on all slideshows. The page can be fully loaded, wait any amount of time you want, and in Chrome and Safari the thumbnails continue to load improperly. If you push one of the arrows to trigger animation to the next image, the thumbnails collapse horizontally as they’re supposed to.
As I said- the page only seems to display properly once autoplay has kicked in- leading me to think it’s not solely a load-time issue. (If autoplay was set to .5 seconds, there would be no issue regardless of 9.4MB page, but then my images would whip around very quickly…)
Also, the version of Safari I’m talking about is 9.0.2. I’m not on a Windows machine, I’m on a Mac.
Thank you for your time!
http://swhammond.com/artwork/photography
-
-
-
- SurfStarMedia
- Jr. Rocketeer
- Posts: 39
- Thanks: 1
- We're Not Models
- I just tried RokBooster. While that did solve the slideshow thumbnail problem, it made the site logo disappear and messed up the RokSprocket modules. Maybe with some tweaking I could get it to work- but curing one headache would cause 3 others, haha.
-
-
-
- SurfStarMedia
- Jr. Rocketeer
- Posts: 39
- Thanks: 1
- We're Not Models
- I've been working on this all day... The problem seems to be around multiple RokGallery modules on the same page. Doesn't matter if it's a slideshow, grid, or showcase. Any module below the first gallery will be broken in Chrome and Safari.
-
-
-
- SurfStarMedia
- Jr. Rocketeer
- Posts: 39
- Thanks: 1
- We're Not Models
-
Fixed.
Created a rt_MYTEMPLATENAME-custom.css file. Here's the long explaination on how to do that: http://www.rockettheme.com/forum/free-joomla-stuff/174956-your-first-css-custom-file-or-less-custom-file
And then inserted this code into the file:
ul.rg-ss-thumb-list #rt-gallery { width: 200% !important; }
All galleries / thumbnails seem to loading properly in Chrome, Safari, and Firefox.
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13484
- Web Designer/Developer
-
That's a workaround and not a fix... I was just about to look at this, which I can still do if you would like?
Regards, Mark. - Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
Time to create page: 0.064 seconds