asked on

Trying find location of images for video player.

I am trying to create a video page. I copied the html, css, and js from another agencies site so that I could add the CC function to the video. The player works ( http://insurance.illinois.gov/videos/TestCC.html ), but I'm missing the icons. I looked in the css and found...

.vjs-default-skin .vjs-volume-level {
  position: absolute;
  top: 0;
  left: 0;
  height: 0.5em;
  /* assuming volume starts at 1.0 */

  width: 100%;
  background: #66a8cc url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAP0lEQVQIHWWMAQoAIAgDR/QJ/Ub//04+w7ZICBwcOg5FZi5iBB82AGzixEglJrd4TVK5XUJpskSTEvpdFzX9AB2pGziSQcvAAAAAAElFTkSuQmCC) -50% 0 repeat;
}

Open in new window

Is there any way I can track down where the images are stored so that I can copy them following this data location code? Once I get the images, how do I replace the above code to properly place the images?

Another option if would be if you know a really nice looking html video playing page that I can use which will utilize the vtt file for playing captions.

ASKER CERTIFIED SOLUTION

Brandon Lyon

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Brandon Lyon

PS: In the code sample you provided the image is encoded in the CSS file. It's referred to as "Base64" or "Data URI". There are base 64 encoders and decoders available online. Any file can be made into a text string and embedded in the CSS file.

https://css-tricks.com/data-uris/

smitty62

ASKER

Here is the page link... http://insurance.illinois.gov/videos/NewVideoPage.html

I was able to download video-js.css, video.js, vjs.eot, vjs.svg, vjs.ttf, vjs.woff, however, I still cannot get the images to show up. Here is the link I currently have posted, but it's to another agency. I'm trying to bring over and get all the files to work on our server.

http://multimedia.illinois.gov/ins/ins-parity.html

Any ideas how I can resolve this?

smitty62

ASKER

Got it! I finally figured it out and replaced the string with a created .png file. Thank you for your help.