user3386779
user3386779

Reputation: 7175

display the content only in colorbox

I want to display the content only in colorbox and want to disappear the content after closed the colorbox. If I add display:none css to the '.ajax' content doesn't display in colorbox. If add removed display the content after closed the popup. I want to disappear the content after closed the popup

Fiddle

<div class="ajax" >
   <img src="https://www.w3schools.com/html/pic_mountain.jpg"/>
   <p>Hello, world!</p>
</div>

$(document).ready(function(){
    $.colorbox({inline:true, href:".ajax"});
});

Upvotes: 0

Views: 339

Answers (2)

You can use the onClose function that colorbox provided.

onClosed: function() {
  $('.ajax').hide()
}

full code:

$(document).ready(function() {
  $.colorbox({
    inline: true,
    href: ".ajax",
    onClosed: function() {
      $('.ajax').hide()

    }
  });
});

Upvotes: 1

Ankit Singh
Ankit Singh

Reputation: 1477

Try this:

$(document).ready(function(){
    $.colorbox({
        inline:true,
        href:".ajax",
        onClosed: function () { // Close event of colorbox
           $('div.ajax').hide();
        }
    });
});

Upvotes: 1

Related Questions