Как добавить в colorbox кнопку «на весь экран»?

Question

[Stilar]

Появилась нужда добавить в плугин colorbox (продвинутый вариант lightbox) дополнительную кнопку.
Кнопка предельна проста - это прямая ссылка на то, что в этом лайтбоксе открывается.



реализация:

$(document).ready(function(){
  
        $(".iframe").colorbox({
          iframe:true, innerWidth:"90%", height:"90%",
          onComplete: function() {
              $("#cboxContent iframe").ready(function(){
                  $("#cboxContent").append('<a id="cboxFullScr" style="float: left;">full screen</a>');
                  $("#cboxFullScr").attr("href", $.colorbox.element().attr("href"));
              });
            }
        });

    });

Но этот код срабатывает 1 раз.
Если открыть лайтбокс, закрыть и открыть еще раз - кнопка не будет нажиматься (у неё уже не будет href-параметра).

Мне явно не хватает опыта понять, почему это происходит и как это можно исправить.
Прошу помощи.

Стенд:
jsbin.com/yovum/1

Answer 1

[Виталий Киренков]

$(document).ready(function(){

    $(".iframe").each(function(){
      var that = $(this);
      that.colorbox({
        iframe:true, innerWidth:"90%", height:"90%",
        onComplete: function() {
            $("#cboxContent iframe").ready(function(){
                $("#cboxContent").append('<a id="cboxFullScr" style="float: left;" href=' + that.attr("href") + '>full screen</a>');
            });
          }
      });
    });

});

Так должно работать по идее

Comments

[Stilar]

бояюсь что нет, не работет =(
даже есть this.attr написать, а не that - что должно быть просто опечатка - кнопка просто не появляется.
jsbin.com/yovum/2

[Виталий Киренков]

Просто скопируйте полностью мой код! и там that не просто так.

[Stilar]

Извините за невнимательность =(

$(".iframe").each(function(){
var that = $(this);
that.colorbox({

вместо

$(".iframe").colorbox({

это было неожиданно...

Да, спасибо большое - всё работает!