Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS How to get a DIV to display over the jw player when a certain condition is met?

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #38765
    n2learning
    Member

    I’m still trying to get my head around all that you can do with css.
    Here’s my dilemma –
    jw player can either playback video in flash/html5. I use a countdown timer in my app between certain videos. Right now the countdown timer is being displayed in a div beneath the jw player.

    I need to get that timer displayed in a div that covers the entire jw player interface.
    Here is the html:



    src="videos/set2_first_5min.flv"
    height="390"
    id="container"
    poster="thumbs/set2_first.png"
    width="720">



    …and css


    #bottomRestTimer {
    margin-top: 2%;
    }
    #bottomRestTimer p {
    font-size: 3em;
    color: @color;
    }

    Here is some of the javascript code that I am using (among other things) to display the ‘countdown’ in the referenced DIV.
    Again, I am trying to find a way to have this DIV cover the height and width of the jw player when it’s called.


    jwplayer("container").setup({
    'file': 'devplaylist.xml',
    'flashplayer': 'js/player.swf',
    'plugins': {
    './countdown.js': {}
    },
    'repeat': 'list',
    'autostart': true,
    'height': 390,
    'width': 720,
    events: {
    onPlaylist: function(event){
    ...
    ...
    }
    onPlaylistItem: function(event){
    ...
    ...
    var minutes = (Math.floor(time/60 ));
    var seconds = time % 60;
    if (seconds < 10) seconds = "0" + seconds;
    var text = minutes + ":" + seconds;
    document.getElementById('resttimer').innerHTML = text;
    //I need to have a DIV display the value of text (the countdown time)
    //directly over the jw player
    time--;
    }, 1000);
    ...
    ...}

    Any suggestions?

Viewing 1 post (of 1 total)
  • You must be logged in to reply to this topic.