English  Italiano  Français  Español  Dansk  Deutsch  Deutsch  Português  Suomi 
Video Lightbox

Is it possible to create another "voverlay" class for video embed player?

Nov 18, 2011

Q: Is it possible to create another "voverlay" class?
I have the problem that we have different sizes of movies on our website that need to fit the voverlay.
I have some movies that are 640x480 px and some that are 1280x720px.

A: To set up several different galleries (galleries with different settings)
on the same page you should for the second gallery:

-change id="videogallery", for example to id="videogallery2".
-set the same id in the engine/css/videolightbox.css file:

#videogallery2 {
        width:100%;
        zoom:1;
}
#videogallery2 span{ display:block; }
#videogallery2 a{
        display:-moz-inline-stack;
        display:inline-block;
        zoom:1;
        *display:inline;
        position:relative;
        vertical-align:top;
        margin:0px;
        width:160px;
        font-family:Trebuchet,Tahoma,Arial,sans-serif;
        font-size:11px;
        font-weight:normal;
        text-decoration:none;
        text-align:center;
        opacity:0.87;
}
#videogallery2 a img{
        display:block;
        border:none;
        margin:0;
}
#videogallery2 a:hover{
        text-decoration:underline;
        opacity:1;
}



-set the same id for the engine/js/videolightbox.js. file:

change:

$("#videogallery a[rel]").overlay({)


to:

$("#videogallery2 a[rel]").overlay({



-You should change in the same way in engine/js/videolightbox.js and in
engine/css/overlay-minimal.css files the following paramters: vcontainer, voverlay and
video_overlay, for example to vcontainer2, voverlay2 and video_overlay2.

Related