I would like to change the background of the media element display for videos to a sample thumbnail. I added this javascript:

$(".field-name-field-dept-video-file .mejs-layers .mejs-overlay").css('background-image', url);

where url is a background-image path, i.e. "url(/sites/default/files/example.jpg)

My js starts like this
(function ($) {
Drupal.behaviors.siteStartup = {
attach: function (context, settings) {

so it gets executed after the page is loaded.

It isn't working. I inserted an alert() before the line that changes the image, and if I wait a second before proceeding,m the image does change.

This tells me my code probably needs to run after the page is fully loaded and rendered (even thought I do see the element in the background when my alert is displayed). What can I do to delay the calling of this script? I've tried increasing the weight when I call drupal_add_js (it's called in a node_preprocess function in my template.php).

What can I do to get this to work at the right time? I'm using Drupal 7.2 and a subtheme of Omega.

Comments

jnettik’s picture

Issue summary: View changes
Status: Active » Closed (outdated)

Old ticket. I think HTML5's poster attribute solves this, which the D8 port supports.