7.8 #permalink GG Slideshow
Lightweight slideshow handling the auto-hiding arrows at the right and left, and associated javascript to preload the photos and handle the arrow navigation.
Markup
<div class="ggSlideshow col_whiteText layout_center">
<a href="javascript:void(0)" class="ggSlideshow-left grid-2 col_ggPrimary5Dark col_inherit layout_center text_fontSizeJumbo layout_centerVertical grid-parent"><div class="layout_centerBoth">‹</div></a>
<a href="https://www.globalgiving.org/pfil/14256/pict_original.jpg" class="js-slideshowLink">
<img
alt="Picture 1"
src="https://www.globalgiving.org/pfil/14256/pict_original.jpg"
class="js-slideshow"
data-slideshow="0"
style="max-width:100%"
/>
</a>
<a href="javascript:void(0)" class="ggSlideshow-right link_subtle grid-2 col_ggPrimary5Dark col_inherit layout_center text_fontSizeJumbo layout_centerVertical grid-parent"><div class="layout_centerBoth">›</div></a>
</div>
<script type="text/javascript">
gg.slideshow = [
"https://www.globalgiving.org/pfil/14256/pict_original.jpg",
"https://www.globalgiving.org/pfil/14256/ph_14256_78491.jpg",
"https://www.globalgiving.org/pfil/14256/ph_14256_51856.jpg",
"https://www.globalgiving.org/pfil/14256/ph_14256_51857.jpg",
"https://www.globalgiving.org/pfil/14256/ph_14256_51858.jpg"
];
deferred.push(["loadJS","/v2/js/modules/ggSlideshow.js"]);
</script>
Source:
modules/07_large_elements/ggSlideshow.less
, line 2