ColorBox - Error: cboxElement missing settings object

Question

What I'm trying to do is to play a video inside ColorBox lightbox.

My HTML code is as follows. When I click on the link it should play the video.

<a href="http://cdn-azu-ns.viddy.com/media/video/0b2b103a-0c40-48a4-877a-64645ef5a0ae-high.mp4?t=634914421568400000" target="_blank" class="photo_link cboxElement iframe">Video</a>

What I do with Colorbox is as below. Load the video into lightbox.

jQuery(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});

It gives me the below error.

Error: cboxElement missing settings object

ScreenShot

What should I do to fix this ? Given that there are no js errors except above one. jQuery is included correctly.

Answer 1

I had the same problem. I'm having a hard time trying to understand why exactly, but somewhere the colorbox is running in to a conflict because it also uses the name 'iframe' internally. Somehow this is causing a conflict when the classname 'iframe' is used as the class by which the function is called.

In my case changing

jQuery(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});

to:

 jQuery(".photo_link").colorbox({iframe:true, width:"80%", height:"80%"});

worked.