https://www.borderstates.com/_ui/responsive/common/js/acc.colorbox.js

1//Makes Color Box Responsive
2var cboxOptions = {
3	width: '95%',
4	height: '95%',
5	maxWidth: '960px',
6	maxHeight: '960px'
7};
8
9$('.cbox-link').colorbox(cboxOptions);
10
11$(window).resize(function(){
12
13    if(!($('#colorbox').hasClass('variantSelectMobile') ||
14        $('#colorbox').hasClass('nonResponsive'))){
15        $.colorbox.resize({
16            width: window.innerWidth > parseInt(cboxOptions.maxWidth) ? cboxOptions.maxWidth : cboxOptions.width,
17            height: window.innerHeight > parseInt(cboxOptions.maxHeight) ? cboxOptions.maxHeight : cboxOptions.height
18        });
19		if ($(window).width() < 639 && !$('#cboxTitle').is(':empty')){
20			$('#cboxLoadedContent').height($('#cboxLoadedContent').height()-24);
21		}
22    }
23});
24
25
26ACC.colorbox = {
27	config: {
28		maxWidth:"100%",
29		opacity:0.7,
30		width:"auto",
31		transition:"none",
32		close:'<span class="glyphicon glyphicon-remove"></span>',
33		title:'<div class="headline"><span class="headline-text">{title}</span></div>',
34		onComplete: function() {
35			$.colorbox.resize();
36			ACC.common.refreshScreenReaderBuffer();
37		},
38		onClosed: function() {
39			ACC.common.refreshScreenReaderBuffer();
40		}
41	},
42
43	open: function(title,config){
44		var config = $.extend({},ACC.colorbox.config,config);
45		config.title = config.title.replace(/{title}/g,title);
46		return $.colorbox(config);
47	},
48
49	resize: function(){
50		$.colorbox.resize();
51	},
52
53	close: function(){
54		$.colorbox.close();
55	}
56};
57