Slideshow with thumbnails

marleyman

Hi,
I have the Ultimate Developer License and I need an image slideshow for a new Joomla site I'm building which has an image slideshow extension on it, which displays thumbnails of the slideshow images below it. Do you have an extension like this? I tried Image and Content Fader from Shape5 but the thumbnails will only display if you're using their one template News Blog. thanks

aman204

marleyman I tried Image and Content Fader from Shape5 but the thumbnails will only display if you're using their one template News Blog

The specific extension has been custom styled to offer varied layout specific to templates. You may also try JA slideshow 3 or GK image show - try and change module style accordingly in basic

Will also forward this suggestion to JA Dev. Team if the specific module can be made more versatile to have this functionality intact as option for showing thumbnail as images in standalone version like seen in S5 News Blog

Regards

marleyman

Hi, I'm not understanding your reply?

I need a slideshow extension like the one you see on this News Blog Demo where the thumbnails are displayed below it:
http://www.shape5.com/demo/index.php?news_blog/

Do you have an image slideshow extension that can do this?

saguaros

marleyman
Hi,

I got your point, Image and Content Fader v4 module inherits the style from S5 News Blog template specific so it has thumbnail + content style like that in demo site.

You can install quickstart package of S5 News Blog template and check this file:

[root]/templates/news_blog/css/template.css

at approx line 3407, you can see the declaration for this module:

/* IMAGE AND CONTENT FADER
----------------------------------------------------------- */

.jdGallery .slideInfoZone {
    background: none !important;
}

.jdGallery .slideElement {
    background-size: 102% auto !important;
}

.jdGallery .slideElement {
    background-size: cover !important;
}

.withArrows a.open {
    width: 100% !important;
    left: 0 !important;
}

.slideInfoZone {
    bottom: auto !important;
    height: auto !important;
    padding: 0px !important;
    width: auto !important;
}

.slideInfoZone br {
    clear: both !important;
    display: block;
}

.jdGallery a.right,
.jdGallery a.left {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)" !important;
    filter: alpha(opacity=100) !important;
    -moz-opacity: 1 !important;
    -khtml-opacity: 1 !important;
    opacity: 1 !important;
    width: 36px !important;
    height: 36px !important;
    float: left !important;
    padding: 0px !important;
    top: 50% !important;
    margin-top: -39px;
    z-index: 3 !important;
}
.....

and copy this style to your current template.

Regards