Edit in JSFiddle

Result
JavaScript
HTML
CSS
Resources

console.DEBUG = 1;
var lightBox = {};
var data = [
    {alt: 'Les pod sněhem',description: 'Les pod sněhem', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_01.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/01.jpg'} },
     {alt: 'Osvětim',description: 'Osvětim', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_02.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/02.jpg'} },
     {alt: 'MIG-15 ve vojenském muzeu Kbely',description: 'MIG-15 ve vojenském muzeu Kbely', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_03.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/03.jpg'} },
     {alt: 'Rozhledna',description: 'Rozhledna', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_04.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/04.jpg'} },
     {alt: 'Beruška',description: 'Beruška', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_05.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/05.jpg'} },
     {alt: 'Česká kotlina',description: 'Česká kotlina', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_06.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/06.jpg'} },
     {alt: 'Mochomůrka červená - houba nejedlá',description: 'Mochomůrka červená - houba nejedlá', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_07.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/07.jpg'} },
     {alt: 'Surikata - nejfotogeničtější zvířátko v ZOO',description: 'Surikata - nejfotogeničtější zvířátko v ZOO', small: {url: 'http://jak.seznam.cz/img/lightbox/tn_08.jpg'}, big: {url: 'http://jak.seznam.cz/img/lightbox/08.jpg'} }
 ];

var opt = {
    galleryClassName: "lightBox",
    zIndex: 10,
    galleryId: 'lightBox',
    useShadow: true,
    usePageShader: false,
    imagePath: 'http://jak.seznam.cz/img/widgets/lightbox/shadow-',
    components: {
        strip: JAK.LightBox.Strip.Scrollable,
        navigation: JAK.LightBox.Navigation.Basic,
        anchorage: JAK.LightBox.Anchorage.Fixed,
        main: JAK.LightBox.Main.CenteredScaled,
        description: JAK.LightBox.Description.Basic,
        transition: JAK.LightBox.Transition.Fade
    },
    stripOpt: {
        orientation: 'horizontal',
        activeBorder: 'outer'
    }
};

JAK.SlideShow = JAK.ClassMaker.makeClass({
    NAME: 'JAK.SlideShow',
    VERSION: '1.0',
    CLASS: 'class',
    IMPLEMENT: [JAK.ISignals]
});

JAK.SlideShow.prototype.$constructor = function(owner, name, settings) {
    this.owner = owner;
    this.options = {
        duration : 2,
        autoplay: false,
        id : false,
        className: 'image-browser-slideshow',
        pauseId: false,
        pauseClassName: 'image-browser-slideshow-pause',
        playId: false,
        playClassName: 'image-browser-slideshow-play'
    };
    /*přepsání výchozího nastavení z uživ. konfigurace*/
    for (var p in settings) { this.options[p] = settings[p]; }
    /*interval pro animaci*/
    this.interval = null;
    /*zbindování metody pro použití v intervalu*/
    this._timeoutDone = this._timeoutDone.bind(this);
    /*úschovna DOM elementu*/
    this.dom = {};
    
    this._ev = [];
    
    this._addEvents();
    this._render();
    /*schování jednoho z tlačítek*/
    this.options.autoplay ? this._hidePlay() : this._hidePause();
};

JAK.SlideShow.prototype.$destructor = function(){
    this.removeListener('close', '_stop', this.owner);
    this.removeListener('transitionDone', '_next', this.owner);

    for (var i in this) {
        this[i] = null;
    }
};

JAK.SlideShow.prototype._addEvents = function() {
    if (this.options.autoplay) {
        this._ev['transitionDone'] = this.addListener('transitionDone', '_next', this.owner);
    }
    this._ev['close'] = this.addListener('close', '_stop', this.owner);
};

JAK.SlideShow.prototype._render = function() {
    var c = JAK.cel('div', this.options.className, this.options.id);

    var pause = JAK.cel('a', this.options.pauseClassName, this.options.pauseId);
    pause.href = '#';
    c.appendChild(pause);

    var play = JAK.cel('a', this.options.playClassName, this.options.playId);
    play.href = '#';
    c.appendChild(play);

    JAK.Events.addListener(pause, 'click', this, '_stopClick');
    JAK.Events.addListener(play, 'click', this, '_playClick');

    this.dom.pause = pause;
    this.dom.play = play;

    this.owner.dom.content.appendChild(c);
};

/**
* metoda spuštěná při kliku na tlačítko pause
* @param {event} e
* @param {HTMLelement} elm
*/
JAK.SlideShow.prototype._stopClick = function(e, elm) {
    JAK.Events.cancelDef(e);
    console.dir(this);
    this.removeListener(this._ev['transitionDone']);
    this._hidePause();
    this._stop();
};

/**
* metoda spuštěná při kliku na tlačítko play
* @param {event} e
* @param {HTMLelement} elm
*/
JAK.SlideShow.prototype._playClick = function(e, elm) {
    JAK.Events.cancelDef(e);
    this._ev['transitionDone'] = this.addListener('transitionDone', '_next', this.owner);
    this._hidePlay();
    this._next();
};

/**
* zastavení slideshow
*/
JAK.SlideShow.prototype._stop = function() {
    clearTimeout(this.interval);
};

/**
* spuštění slideshow
*/
JAK.SlideShow.prototype._next = function() {
    this.interval = setTimeout(this._timeoutDone, this.options.duration*1000);
};

/**
* schování tlačítka play, zobrazení pause
*/
JAK.SlideShow.prototype._hidePlay = function() {
    this.dom.play.style.display = 'none';
    this.dom.pause.style.display = '';
};

/**
* schování tlačítka pause, zobrazení play
*/
JAK.SlideShow.prototype._hidePause = function() {
    this.dom.play.style.display = '';
    this.dom.pause.style.display = 'none';
};

/**
* metoda volaná timeoutem, který je nastaven v metodě _next
* zde je vlastní posunutí na další obrázek
*/
JAK.SlideShow.prototype._timeoutDone = function() {
    clearTimeout(this.interval);
    this.owner.next();
};

opt.components.others = [];
opt.components.others.push({name: 'slideshow', part: JAK.SlideShow});

lightBox.g = new JAK.LightBox(data, opt);

lightBox.openGallery = function (e, elm) {
    lightBox.g.show(0);
}

JAK.Events.addListener(JAK.gel("showGallery"),"click", lightBox,"openGallery");

<p><a href="#" id="showGallery">Zobrazení galerie</a>.</p>

body { color: #000000; font-family: Arial,sans-serif; font-size: 81.5%; }
p { margin-top: 6px; }
/*galerie s obrazky dole*/
/*rozmery galerie*/
#lightBox {background-color: black; width: 800px; <strong>height: 547px;</strong> padding-top:10px; padding-left: 10px; padding-right: 10px;}
#lightBox .image-browser-image {width: 800px; height: 450px; border: 1px solid #333; overflow: hidden; padding: 0px; float: left; position: relative;}
/*nahledovy pas*/
#lightBox .image-browser-thumbs {width: 800px;height: 81px; overflow-x:scroll; clear: both;}
#lightBox .image-browser-thumbs table {border-collapse:separate; border-spacing:3px 3px;}
#lightBox .image-browser-thumbs td {padding: 0px; border: 1px solid #333;}
#lightBox .image-browser-thumbs .image-browser-thumb-box {height: 55px; width: 100px; padding: 0px; margin: 3px; border: 1px solid #333; }
/*ramecek okolo aktivniho nahledu*/
#lightBox .image-browser-active {border: 3px solid red;}

/*zasednuti pod galerii*/
div.image-browser-root { _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/bg.png', sizingMethod='scale' );}
div[class~="image-browser-root"] { background: url(http://jak.seznam.cz/img/widgets/lightbox/bg.png); }

/*ovladaci tlacitka*/
#lightBox .image-browser-prev { position: absolute; top: 20px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-previous-active.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-previous-active.png'));}
#lightBox .image-browser-prev:hover { background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-previous-hover.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-previous-hover.png')); }
#lightBox .image-browser-next { position: absolute; top: 20px; left: 66px; display: block; width: 42px; height: 36px; cursor: pointer; background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-next-active.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-next-active.png')); }
#lightBox .image-browser-next:hover { background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-next-hover.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-next-hover.png')); }
#lightBox .image-browser-prev-disabled { position: absolute; top: 20px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-previous-inactive.png); _background: none;  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-previous-inactive.png')); }
#lightBox .image-browser-next-disabled { position: absolute; top: 20px; left: 66px; display: block; width: 42px; height: 36px; cursor: pointer; background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-next-inactive.png); _background: none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-next-inactive.png')); }
#lightBox .image-browser-close { position: absolute; top: 20px; left: 760px; display: block; width: 42px; height: 36px; cursor: pointer; background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-close-active.png); _background:none ;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-close-active.png'));}
#lightBox .image-browser-close:hover { background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-close-hover.png); _background:none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-close-hover.png'));}
.image-browser-slideshow-pause { position: absolute; top: 414px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-slideshow-pause.png); _background:none ;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-slideshow-pause.png'));}
.image-browser-slideshow-play { position: absolute; top: 414px; left: 20px; display: block; width: 42px; height: 36px; cursor: pointer; background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-slideshow-active.png); _background:none ;_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-slideshow-active.png'));}
.image-browser-slideshow-play:hover { background: url(http://jak.seznam.cz/img/widgets/lightbox/lb-slideshow-hover.png); _background:none; _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://jak.seznam.cz/img/widgets/lightbox/lb-slideshow-hover.png'));}

External resources loaded into this fiddle: