Question

I need some help. I am bringing in a string from a custom field in wordpress. This string is an iframe embed code for both youtube and vimeo. I need to add a class to this iframe in order for fancybox to do its thing.

<?php
$videoLinks=get_post_meta($post->ID, "iframe video embed code", true);
echo $videoLinks;?>
<script>
$('iframe').addClass('fancybox fancybox.iframe');
</script>

When testing by inserting an iframe embed code in the custom field I get this. (no class added)

<iframe src="http://player.vimeo.com/video/33039612?title=0&amp;byline=0&amp;portrait=0" width="400" height="225" frameborder="0"    webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe><p><a   href="http://vimeo.com/33039612">HG Skis: Trillinton..</a> from <a   href="http://vimeo.com/hgskis">HG Skis</a> on <a href="http://vimeo.com">Vimeo</a>.</p>  <script>
$('iframe').addClass('fancybox fancybox.iframe');
</script>

Relatively new to jquery, fancybox works on images manually tagged with fancybox class. Will adding class based on a certain event fix my issue?

Answer 1

try

<script>
 $(document).ready(function(){
  $('iframe').addClass('fancybox fancybox.iframe');
 });
</script>

it should play the trick… of course, I assume you are using fancybox v2.x