Gopinath
Gopinath

Reputation: 1858

How to display jQuery Dialog on top of YouTube Video/SlideShare PPT?

We use jQuery modal dialog box to get confirmation from users before they delete an item. The modal dialog works fine as long as there are no YouTube videos on the screen.

If there is a YouTube video the dialog box is displayed beneath the video. I tried changing the z-index of dialog to 3999, but no use. (I don't know much about CSS)

               $('#dialog').dialog({
                     autoOpen: false,
                     modal: true,
                     width: 300,
                     zindex:3999,
                     buttons: {
                                'Ok': performDelete_dialog, 
                                'Cancel': function(){$(this).dialog('close');}
                              }
                  });

Can some one suggestme what should we do to place jquery dialog box on top of YouTube videos?

Upvotes: 3

Views: 12061

Answers (4)

mweldan
mweldan

Reputation: 1

found in jquery dialog demo

$('#element').dialog({zIndex: 3999});

Upvotes: 0

Jag
Jag

Reputation: 11

It's a problem with Flash - see http://www.ubercart.org/forum/support/2261/youtube_overlapping_thickbox

This looks like a flash issue. Try changing your "wmode" parameter on the YouTube clip to "transparent" or "opaque."

Upvotes: 1

Shiva Srikanth Thummidi
Shiva Srikanth Thummidi

Reputation: 2908

see this u may get solution

Upvotes: 2

Sinan Taifour
Sinan Taifour

Reputation: 10805

Replace zindex with zIndex; jQuery takes these properties in camelCase. Also, make sure the value you are specifying for the z-index is more than that of the Flash movie on the page.

To find out the z-index of the Flash movie on the page, you could use FireBug (A FireFox addon), which will also prove very helpful if you are learning CSS or doing a lot of web development.

Upvotes: 2

Related Questions