Используя Colorbox, как я могу создать состояния истории браузера для каждого модального окна?

Да, это можно сделать. Здесь я предполагаю, что вы собираетесь использовать встроенный контент (скрытый) для своих модальных окон. Ссылки откроют ваши цветные окна, но вместо того, чтобы прикреплять цветное окно к ссылке обычным способом, вы просто используете обычные ссылки с параметром запроса, определяющим, какое модальное окно открывать: ?cb=modal1. Затем в вашем docReady вы просто ищете параметры цветового поля в строке запроса и открываете соответствующее цветовое поле. Таким образом, не имеет значения, где находится ваша ссылка, и нет необходимости объявлять ссылки как ссылку с цветовой рамкой. В этом примере используется функция getParameterByName в этом ответе, но Конечно, вы можете использовать любую стратегию, которая вам нравится, чтобы получить параметры запроса.

$(document).ready(function() {
    var modal = getParameterByName("cb");

    if(modal != "") {
        $.colorbox({
            href: "#" + modal,
            inline: true
        });
    }
});

Тогда любая ссылка на модальное окно будет выглядеть так:

<a href="yourpage?cb=modal1">Open modal 1</a>

Ознакомьтесь с полным кодом для этого на этом jsfiddle.

Обновление: кнопка "Назад" закрывает цветовую панель

Прочитав ваши комментарии, я лучше понимаю, чего вы хотите добиться. Итак, если вам нужно только закрыть цветовое поле, когда пользователь нажимает кнопку «Назад», вместо строк запроса вы можете использовать хэши URL-адресов в своих ссылках:

<a href="#colorbox-modal1">Open colorbox</a>

Чтобы отслеживать изменения в хэше местоположения, вы можете использовать этот подключаемый модуль jQuery onhashchange или что-то подобное. И затем в вашем docReady:

$(document).ready(function() {
    $(window).hashchange(function(){
            //gets the colorbox content id from the url hash
        var getCb = function() { return location.hash.match(/(#colorbox-.*)/) && RegExp.$1 },
            cb = getCb();

        if(cb) {
            $.colorbox({
                href: cb, 
                inline: true,
                //if closing with ESC key or overlay click, we
                //need to go back so that hashchange is fired
                //if the same colorbox is opened again
                onClosed: function() {
                    if(getCb()) {
                        history.go(-1);
                    }
                }
            });
        } else {
            $.colorbox.close();
        }
    })
});

Вот скрипт для этого, но с отказом от ответственности: IE8 и IE9 имеют проблемы с этим кодом пока он внутри скрипки. Хотя, когда я вынимаю его, все в порядке.

Что ж, я нашел ответ для вопрошающего (если кому-то еще интересно). Вам понадобится плагин haschange, упомянутый выше. Я использую следующее решение на DRUPAL-сайте с плагином colorbox.

Вот так:

// When colorbox completed, add the hash "#colorbox"
$(document).bind('cbox_complete', function () { 
  window.location.hash = '#colorbox';
});

$(window).hashchange(function(){
  // Return true if hash was found
  var getCb = function() { return location.hash.match('#colorbox')},
  cb = getCb();
  // If there is no hash (which happens when using the browsers back-button), close the colorbox
  if(!cb) {
    $.colorbox.close();
  }
});  

Вот и все :)