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

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

268d19c2711c4fc5b3c2153497280e14.jpg

реализация:

$(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
  • Вопрос задан
  • 3002 просмотра
Решения вопроса 1
DeLaVega
@DeLaVega
Верстаю, фронтэндю =)
$(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>');
            });
          }
      });
    });

});


Так должно работать по идее
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы