我遇到了正确的脑筋急转弯。我一直在我的大商店上编写年龄验证程序，该程序由
组成lightbox.js
cookies.js
jquery.js
support.js
Cookies灯箱和jquery正在运行。我在我的CSS中签署了一个背景图片，当灯箱自动编写弹出窗口时....但它只是黑色背景....图像没有显示...我相信你们这是一个小isee：P但我无法弄清楚大商业中的好朋友......也许你会知道问题是什么
css style+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
#verify {
background: url("http://www.cig-go.com/content/agecheck/halt.png') top center no- repeat;
display: none;
width: 508px;
height: 439px;
position: relative;
list-style: none;
}
#verify p, #verify span {visibility: hidden;}
#verify a.v-yes, #verify a.v-no {
display: block;
position: absolute;
text-decoration: none;
}
#verify a.v-yes {
width: 76px;
height: 32px;
bottom: 73px;
right: 91px;
}
#verify a.v-no {
width: 80px;
height: 32px;
position: absolute;
bottom: 73px;
left: 87px;
}
support.js+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
$(window).load(function () {
// Halt! Age identification
// Includes checking for and setting a cookie with cookies.js
if(!$.cookie('legal-age')){
$('#verify').lightbox_me({
centered: true,
closeClick: false,
closeESC: false,
overlayCSS: {background: 'black', opacity: 1},
closeSelector: '.v-yes',
onClose: function(){
$.cookie('legal-age','yes', {domain: 'www.cig- go.com', path: '/'});
}
});
e.preventDefault();
}
});
HTML PAGE CODE ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ++
<div id="verify">
<p>By law, we are not allowed to advertise to minors. Are you 21 years or older?</p>
<ul>
<li><a href="http://goo.gl/buif3" class="v-no" title="I am 12."><span>No</span></a></li>
<li><a href="#" class="v-yes" title="Let me in!"><span>Yes</span></a></li>
</ul>
</div><!-- END verify -->
lightbox.js +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
/ * * $ lightbox_me *作者：巴克威尔逊 *版本：2.3 * *根据Apache许可证2.0版（“许可证”）获得许可; *除非符合许可，否则您不得使用此文件。 *您可以在以下位置获取许可证副本 * * http://www.apache.org/licenses/LICENSE-2.0 * *除非适用法律要求或书面同意，否则软件 *根据许可证分发的“按现状”分发， *不附带任何明示或暗示的保证或条件。 *有关管理权限的特定语言，请参阅许可证 *许可证下的限制。 * /
（function（$）{
$.fn.lightbox_me = function(options) {
return this.each(function() {
var
opts = $.extend({}, $.fn.lightbox_me.defaults, options),
$overlay = $(),
$self = $(this),
$iframe = $('<iframe id="foo" style="z-index: ' + (opts.zIndex + 1) + ';border: none; margin: 0; padding: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0; filter: mask();"/>'),
ie6 = ($.browser.msie && $.browser.version < 7);
if (opts.showOverlay) {
//check if there's an existing overlay, if so, make subequent ones clear
var $currentOverlays = $(".js_lb_overlay:visible");
if ($currentOverlays.length > 0){
$overlay = $('<div class="lb_overlay_clear js_lb_overlay"/>');
} else {
$overlay = $('<div class="' + opts.classPrefix + '_overlay js_lb_overlay"/>');
}
}
/*----------------------------------------------------
DOM Building
---------------------------------------------------- */
if (ie6) {
var src = /^https/i.test(window.location.href || '') ? 'javascript:false' : 'about:blank';
$iframe.attr('src', src);
$('body').append($iframe);
} // iframe shim for ie6, to hide select elements
$('body').append($self.hide()).append($overlay);
/*----------------------------------------------------
Overlay CSS stuffs
---------------------------------------------------- */
// set css of the overlay
if (opts.showOverlay) {
setOverlayHeight(); // pulled this into a function because it is called on window resize.
$overlay.css({ position: 'absolute', width: '100%', top: 0, left: 0, right: 0, bottom: 0, zIndex: (opts.zIndex + 2), display: 'none' });
if (!$overlay.hasClass('lb_overlay_clear')){
$overlay.css(opts.overlayCSS);
}
}
/*----------------------------------------------------
Animate it in.
---------------------------------------------------- */
//
if (opts.showOverlay) {
$overlay.fadeIn(opts.overlaySpeed, function() {
setSelfPosition();
$self[opts.appearEffect](opts.lightboxSpeed, function() { setOverlayHeight(); setSelfPosition(); opts.onLoad()});
});
} else {
setSelfPosition();
$self[opts.appearEffect](opts.lightboxSpeed, function() { opts.onLoad()});
}
/*----------------------------------------------------
Hide parent if parent specified (parentLightbox should be jquery reference to any parent lightbox)
---------------------------------------------------- */
if (opts.parentLightbox) {
opts.parentLightbox.fadeOut(200);
}
/*----------------------------------------------------
Bind Events
---------------------------------------------------- */
$(window).resize(setOverlayHeight)
.resize(setSelfPosition)
.scroll(setSelfPosition)
.keyup(observeKeyPress);
//$overlay.click(function(e) { closeLightbox(); e.preventDefault; });
$self.delegate(opts.closeSelector, "click", function(e) {
closeLightbox(); e.preventDefault();
});
$self.bind('close', closeLightbox);
$self.bind('reposition', setSelfPosition);
/*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*----------------------------------------------------
Private Functions
---------------------------------------------------- */
/* Remove or hide all elements */
function closeLightbox() {
var s = $self[0].style;
if (opts.destroyOnClose) {
$self.add($overlay).remove();
} else {
$self.add($overlay).hide();
}
//show the hidden parent lightbox
if (opts.parentLightbox) {
opts.parentLightbox.fadeIn(200);
}
$iframe.remove();
// clean up events.
$self.undelegate(opts.closeSelector, "click");
$(window).unbind('reposition', setOverlayHeight);
$(window).unbind('reposition', setSelfPosition);
$(window).unbind('scroll', setSelfPosition);
$(window).unbind('keypress', observeKeyPress);
if (ie6)
s.removeExpression('top');
opts.onClose();
}
/* Function to bind to the window to observe the escape/enter key press */
function observeKeyPress(e) {
if((e.keyCode == 27 || (e.DOM_VK_ESCAPE == 27 && e.which==0)) && opts.closeEsc) closeLightbox();
}
/* Set the height of the overlay
: if the document height is taller than the window, then set the overlay height to the document height.
: otherwise, just set overlay height: 100%
*/
function setOverlayHeight() {
if ($(window).height() < $(document).height()) {
$overlay.css({height: $(document).height() + 'px'});
$iframe.css({height: $(document).height() + 'px'});
} else {
$overlay.css({height: '100%'});
if (ie6) {
$('html,body').css('height','100%');
$iframe.css('height', '100%');
} // ie6 hack for height: 100%; TODO: handle this in IE7
}
}
/* Set the position of the modal'd window ($self)
: if $self is taller than the window, then make it absolutely positioned
: otherwise fixed
*/
function setSelfPosition() {
var s = $self[0].style;
// reset CSS so width is re-calculated for margin-left CSS
$self.css({left: '50%', marginLeft: ($self.outerWidth() / 2) * -1, zIndex: (opts.zIndex + 3) });
/* we have to get a little fancy when dealing with height, because lightbox_me
is just so fancy.
*/
// if the height of $self is bigger than the window and self isn't already position absolute
if (($self.height() + 80 >= $(window).height()) && ($self.css('position') != 'absolute' || ie6)) {
// we are going to make it positioned where the user can see it, but they can still scroll
// so the top offset is based on the user's scroll position.
var topOffset = $(document).scrollTop() + 40;
$self.css({position: 'absolute', top: topOffset + 'px', marginTop: 0})
if (ie6) {
s.removeExpression('top');
}
} else if ($self.height()+ 80 < $(window).height()) {
//if the height is less than the window height, then we're gonna make this thing position: fixed.
// in ie6 we're gonna fake it.
if (ie6) {
s.position = 'absolute';
if (opts.centered) {
s.setExpression('top', '(document.documentElement.clientHeight || document.body.clientHeight) / 2 - (this.offsetHeight / 2) + (blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + "px"')
s.marginTop = 0;
} else {
var top = (opts.modalCSS && opts.modalCSS.top) ? parseInt(opts.modalCSS.top) : 0;
s.setExpression('top', '((blah = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop) + '+top+') + "px"')
}
} else {
if (opts.centered) {
$self.css({ position: 'fixed', top: '50%', marginTop: ($self.outerHeight() / 2) * -1})
} else {
$self.css({ position: 'fixed'}).css(opts.modalCSS);
}
}
}
}
});
};
$.fn.lightbox_me.defaults = {
// animation
appearEffect: "fadeIn",
appearEase: "",
overlaySpeed: 250,
lightboxSpeed: 300,
// close
closeSelector: ".close",
closeClick: true,
closeEsc: true,
// behavior
destroyOnClose: false,
showOverlay: true,
parentLightbox: false,
// callbacks
onLoad: function() {},
onClose: function() {},
// style
classPrefix: 'lb',
zIndex: 999,
centered: false,
modalCSS: {top: '40px'},
overlayCSS: {background: 'black', opacity: .3}
}
}）（jQuery的）;
jquery.min.1.6.1 .js ++++++++++++++++++++++++++++++++++
要包括