Fix Youtube overlay prettyphoto/fancybox

I was struggling when i found that when you opened an image on prettyphoto and you had an embed youtube video at the description it would show over the pics…after googling and trying i found 2 options to fix this.



Option 1



add


<br />
&wmode=opaque<br />

```<br />
<br />
at the end of the iframe url of the embed code<br />
<br />
[b]Option 2[/b]<br />
<br />
i found this method because i did not want to go to all the embed videos i had and modify them, so this you do not need to add the &wmode=opaque to the url it will do it automatically<br />
<br />
You have to create a file named scripts.post.tpl at this folder skins/YOU_SKIN/customer/addons/my_changes/hooks/index/<br />
<br />
The file should contain this:<br />
<br />
```php
<br />
{literal}<br />
<script type="text/javascript"><br />
$(document).ready(function() {<br />
	$("iframe").each(function(){<br />
		var ifr_source = $(this).attr('src');<br />
		var wmode = "wmode=transparent";<br />
		if(ifr_source.indexOf('?') != -1) {<br />
			var getQString = ifr_source.split('?');<br />
			var oldString = getQString[1];<br />
			var newString = getQString[0];<br />
			$(this).attr('src',newString+'?'+wmode+'&'+oldString);<br />
		}<br />
		else $(this).attr('src',ifr_source+'?'+wmode);<br />
	});<br />
});<br />
</script><br />
{/literal}<br />

```<br />
<br />
This code was found at [url="http://maxmorgandesign.com/fix_youtube_iframe_overlay_and_z_index_issues/"]http://maxmorgandesi...z_index_issues/[/url]<br />
<br />
I am be no mean a coder so if there is someone who knows of a better way please post it

I don't know if this will help, but I found the same overlay problem in wordpress and the solution was to add:


allowtransparency="true"



in youtube embed code, example: