Does anyone know of a clean way to add an attribute to an iframe tag, or to add an equivalent parameter to the src attribute? Here is what I am trying to do:

I am using the iframe wysiwyg button in Ckeditor to allow users to paste in a video url from YouTube. The problem is, the mega menu dropdown shows up behind the video. To fix this, the iframe tag for the video either needs to have the attribute wmode="transparent added to it, or the actual src url needs to have the parameter &wmode=transparent appended.

Ideally, this would be enforced and not asked of the user. Has anyone dealt with this and implemented a solution? If so, please let me know what you did. Thanks!

  • have you thought about a simple JavaScript function that checks page content? Oct 16 '15 at 17:59
  • That might be a route to go. I have a custom helper module for the wysiwyg module which uses hook_wysiwyg_editor_settings_alter, so ideally I'd like to build on that. I'm fairly novice at javascript unfortunately, but perhaps the right solution could be added to my custom module.
    – PWM
    Oct 16 '15 at 18:39

As a quick and dirty work-around, I used jquery to add a parameter to the url (which always has at least one parameter already, thus the ampersand).

$('iframe').each(function() { $(this).attr("src", $(this).attr("src") + '&wmode=transparent') });

But I want to later refine this to only target urls starting with https://www.youtube.com at the very least and use an attribute instead of a parameter. If anyone can suggest the code for that based on what's above, that would be appreciated. If not, I'll eventually update this post with that code when I have more time to figure it out. Thanks.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.