我这里有个弹出层效果,但是弹出层随着滚动条往下滚动,想要一个不滚动的,哪位大侠给改一下,留下联系方式,我给您发过去,十分感谢
解决方案 »
- JS代码在JSP中好用,单独在JS中不起作用了,求大虾们帮帮忙,在线等答案
- 新人求助~ 如何让页面延时显示
- 要实现一个效果,点击按钮,当前页面横向切换成另一个页面。。。
- 二级联动下拉菜单的问题
- 求高手解密这段js。。。。
- 急,请问如何用正则表达式检查一个输入值,输入值可以为负数,0,正数,小数点后面可以最多有四位?
- 用户登录后出现Redirected to new location的提示页面,怎么解决?(javascript和Netscape Enterprise3.0写的一个管理系统,在线高分答谢
- javascript门外汉求救!!!
- 这段程序只能循环显示两幅图,请高手帮忙改成可以显示多幅图的,谢谢。
- javascript和数组的问题
- 求助,如何将此js改成“函数”方式的
- 半成品:模仿etao商品分类代码,求整理
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/thickbox_plus.js"></script>
<link rel="stylesheet" type="text/css" href="css/thickbox.css"/>
</head>
<body>
<a href="ShowLogin.html?height=460;width=500" title="应聘该职位并投递简历" class="thickbox" >马上应聘该职位</a></body>
</html>
thickbox_plus.js内容:
$(document).ready(TB_launch); // function for adding Thickbox to elements of class .thickbox
// wrapped by Christian Montoya for uses other than $(document).ready
function TB_launch() {
$("a.thickbox").click(function(){
var t = this.title;
TB_show(t,this.href);
this.blur();
return false;
});
}function TB_show(caption, url) { //function called when the user clicks on a thickbox link
try {
$("body")
.append("<div id='TB_overlay'></div><div id='TB_window'></div>");
$("#TB_overlay").css("opacity","0.6");
$("#TB_overlay").css("filter","alpha(opacity=60)");
$("#TB_overlay").css("-moz-opacity","0.6");
$(window).resize(TB_position);
$("body").append("<div id='TB_load'><div id='TB_loadContent'><img src='images/circle_animation.gif' /></div></div>");
$("#TB_overlay").show();
var urlString = /.jpg|.jpeg|.png|.gif|.html|.htm/g;
var urlType = url.match(urlString);
if(urlType == '.jpg' || urlType == '.jpeg' || urlType == '.png' || urlType == '.gif'){//code to show images var imgPreloader = new Image();
imgPreloader.onload = function(){ // Resizing large images added by Christian Montoya
var de = document.documentElement;
var x = (self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth) - 50;
var y = (self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight) - 80;
if(imgPreloader.width > x) {
imgPreloader.height = imgPreloader.height * (x/imgPreloader.width);
imgPreloader.width = x;
if(imgPreloader.height > y) {
imgPreloader.width = imgPreloader.width * (y/imgPreloader.height);
imgPreloader.height = y;
}
}
else if(imgPreloader.height > y) {
imgPreloader.width = imgPreloader.width * (y/imgPreloader.height);
imgPreloader.height = y;
if(imgPreloader.width > x) {
imgPreloader.height = imgPreloader.height * (x/imgPreloader.width);
imgPreloader.width = x;
}
}
// End Resizing TB_WIDTH = imgPreloader.width + 30;
TB_HEIGHT = imgPreloader.height + 60;
$("#TB_window").append("<img id='TB_Image' src='"+url+"' width='"+imgPreloader.width+"' height='"+imgPreloader.height+"' alt='"+caption+"'/>"+ "<div id='TB_caption'>"+caption+"</div><div id='TB_closeWindow'><a href='#' id='TB_closeWindowButton'>关闭</a></div>");
$("#TB_closeWindowButton").click(TB_remove);
$("#TB_Image").click(TB_remove); // close when image clicked added by Christian Montoya
TB_position();
$("#TB_load").remove();
$("#TB_window").slideDown("normal");
}
imgPreloader.src = url;
}
if(urlType == '.htm' || urlType == '.html'){//code to show html pages
var queryString = url.replace(/^[^\?]+\??/,'');
var params = parseQuery( queryString );
TB_WIDTH = (params['width']*1) + 30;
TB_HEIGHT = (params['height']*1) + 40;
ajaxContentW = TB_WIDTH - 30;
ajaxContentH = TB_HEIGHT - 45;
$("#TB_window").append("<div id='TB_closeAjaxWindow'><a href='#' id='TB_closeWindowButton'>关闭</a></div><div id='TB_ajaxContent' style='width:"+ajaxContentW+"px;height:"+ajaxContentH+"px;'></div>");
$("#TB_closeWindowButton").click(TB_remove);
$("#TB_ajaxContent").load(url, function(){
TB_position();
$("#TB_load").remove();
$("#TB_window").slideDown("normal");
});
}
} catch(e) {
alert( e );
}
}//helper functions belowfunction TB_remove() {
// #TB_load removal added by Christian Montoya; solves bug when overlay is closed before image loads
$("#TB_window").fadeOut("fast",function(){$('#TB_window,#TB_overlay,#TB_load').remove();});
return false;
}function TB_position() {
var de = document.documentElement;
var w = self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
var h = self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
if (window.innerHeight && window.scrollMaxY) {
yScroll = window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
yScroll = document.body.scrollHeight;
} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
yScroll = document.body.offsetHeight;
}
$("#TB_window").css({width:TB_WIDTH+"px",height:TB_HEIGHT+"px",
left: ((w - TB_WIDTH)/2)+"px", top: ((h - TB_HEIGHT)/2)+"px" });
$("#TB_overlay").css("height",yScroll +"px");
}function parseQuery ( query ) {
var Params = new Object ();
if ( ! query ) return Params; // return empty object
var Pairs = query.split(/[;&]/);
for ( var i = 0; i < Pairs.length; i++ ) {
var KeyVal = Pairs[i].split('=');
if ( ! KeyVal || KeyVal.length != 2 ) continue;
var key = unescape( KeyVal[0] );
var val = unescape( KeyVal[1] );
val = val.replace(/\+/g, ' ');
Params[key] = val;
}
return Params;
}
css样式:
body {background-color:#fff;}
html, body {height:100%;}
html body{font:12px Arial, Helvetica, sans-serif;color:#333333}
html>body{font:12px Arial, Helvetica, sans-serif;color:#333333}
#TB_overlay {
position: absolute;
top: 0;
left: 0;
z-index:100;
width: 100%;
height: 100%;
background-color:#CCC;
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}
#TB_window {
top: 0px;
left: 0px;
position: fixed;
_position: absolute;
background: #fff;
z-index: 102;
color:#000000;
display:none;
border:5px solid #666;
}
#TB_caption{
height:25px;
padding:10px 30px 10px 25px;
}
#TB_closeWindow{
height:25px;
padding:10px 25px 10px 0;
float:right;
}
#TB_closeAjaxWindow{
padding:5px 10px 7px 0;
margin-bottom:1px;
text-align:right;
background-color:#e8e8e8;
}
#TB_ajaxContent{
padding:2px 15px 15px 15px;
overflow:auto;
}#TB_load{
text-align: center;
position: absolute;
top: 50%;
left: 0px;
width: 100%;
overflow: visible;
visibility: visible;
display: block;
z-index:101;
}
#TB_loadContent{
margin-left: -125px;
position: absolute;
top: -50px;
left: 50%;
width: 250px;
height: 100px;
visibility: visible;
}