2

What could be wrong with this script? Both work in firebug when I tamper with them. No errors pop on the console. But when I reload the page, the script does nothing.

The purpose is to select a set of fonts, sizes, widths, etc, based on the language chosen in Video.JS Webvtt captions.

URL: http://yavaway.com/captions/

The video currently there has hardcoded "burned" captions used for visual aid to format my own caption styles.

Script 1

<script type="text/javascript">      
  jQuery(document).ready(function(jQuery){
    /* User clicks on a caption */
    jQuery('.vjs-selected').on('click',function() {    
    /* If the text enclosed by this element contains the string: Vietnamese add the vietnamese caption attributes and remove the english caption attributes */ 
       if (jQuery('li.vjs-menu-item.vjs-selected:contains("Vietnamese")').length) { jQuery('#intro').addClass('viet-subs'); jQuery('#intro').removeClass('eng-caps'); }
    /* If the text enclosed by this element contains the string: English add the english caption attributes and remove the vietnamese caption attributes */
       if (jQuery('li.vjs-menu-item.vjs-selected:contains("English")').length) { jQuery('#intro').addClass('eng-caps'); jQuery('#intro').removeClass('viet-subs'); }
    });
  });
</script>

Script 2

<script type="text/javascript">
  $( document ).ready(function() {
    /* User clicks on a caption */
    jQuery("li.vjs-selected").on("click",function() {

    /* If the text enclosed by this element contains the string: English add the english caption attributes and remove the vietnamese caption attributes */          jQuery('li.vjs-menu-item.vjs-selected:contains("English")').each(function () {
         jQuery(function () {
            jQuery('#intro').each(function () {
               jQuery(this).addClass("eng-caps");
               jQuery(this).removeClass("viet-subs");
            });
         });
      });
    /* If the text enclosed by this element contains the string: Vietnamese add the vietnamese caption attributes and remove the english caption attributes */
      jQuery('li.vjs-menu-item.vjs-selected:contains("Vietnamese")').each(function () {
         jQuery(function () {
            jQuery('#intro').each(function () {
               jQuery(this).addClass("viet-subs");
               jQuery(this).removeClass("eng-caps");
            });
         });
      });
    });
  });
</script>

The CSS

.eng-caps .vjs-tt-cue {
    background-color: rgba(0, 0, 0, 0.5);
    font-family: Trebuchet MS;
    font-size: 24px;
    text-align: start;
    color: #ff6;
}
.viet-subs .vjs-tt-cue {
    background-color: none;
    font-family: Arial;
    font-size: 24px;
    text-align: center;
    color: #fff;
}

0 Answers0