87,910
社区成员
发帖
与我相关
我的任务
分享关于定位的问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Sohu_Crazy </title>
<meta name="generator" content="editplus" />
</head>
<body>
<script type="text/javascript">
<!--
var isIE = (document.all) ? true : false;
var isIE6 = isIE && ([/MSIE (\d)\.0/i.exec(navigator.userAgent)][0][1] == 6);
var $ = function(sId){
return "string" == typeof(sId) ? document.getElementById(sId) : sId;
}
var Bind = function(object, fun){
return function() {
return fun.apply(object, arguments);
}
}
function addEventHandler(oTarget, sEventType, fnHandler){
if(oTarget.addEventListener){
oTarget.addEventListener(sEventType, fnHandler, false);
}else if(oTarget.attachEvent){
oTarget.attachEvent("on" + sEventType, fnHandler);
}else{
oTarget["on" + sEventType] = fnHandler;
}
}
var isSafa = (window.openDatabase) ? true : false;
var YoYiCrazy = function(){
this.oMaxContianer_Width = 500; // 大DIV宽
this.oMaxContianer_Height = 300; // 大DIV高
this.oSmallContainer_Width = 300; // 小DIV宽
this.oSmallContainer_Height = 300; // 小DIV高
this.oMaxFlash_Width = 500; // 大素材宽
this.oMaxFlash_Height = 300; // 大素材高
this.oMaxFlash_Url = ""; // 大素材地址
this.oMinFlash_Width = 300; // 小素材宽
this.oMinFlash_Height = 300; // 小素材高
this.oMinFlash_Url = ""; // 小素材地址
this.isMaxFollow = false; // 大素材跟随
this.isMinFollow = false; // 小素材跟随
this.isBothShow = false; // 是否同时显示
this.isCenter = false; // 是否居中
this.isFixed = true; // 是否固定定位
if(!this.isCenter){
this._maxMiddleTop = 0;
this._maxMiddleLeft = 0;
}
};
YoYiCrazy.prototype = {
// 创建容器Div
CreateContainer:function(){
document.write("<div id='crazy_maxdiv' style='width:"+this.oMaxContianer_Width+"px;height:"+this.oMaxContianer_Height+"px;z-index:12299;border:2px solid #D8D8D8' onMouseDown='return false;'></div>");
this.Container = $("crazy_maxdiv");
},
// 兼容IE6的居中定位程序
SetCenter: function(){
alert("dd")
this.Container.style.marginTop = d.scrollTop - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = d.scrollLeft - this.Container.offsetWidth / 2 + "px";
},
SetFixed: function(){
this.StartPoint = parseInt(this.Container.offsetTop, 10);
this.EndPoint = d.scrollTop + this.Container.offsetTop;
if(this.StartPoint != this.EndPoint){
this.ScrollAmount = Math.abs(this.EndPoint - this.StartPoint);
this.Container.offsetTop = parseInt(this.Container.style.top, 10) + ((this.EndPoint < this.StartPoint) ? -this.ScrollAmount : this.ScrollAmount) + "px";
}
},
// 插入Flash
InsertFlash:function(elementId,w,h,url){
if($(elementId)){
var str = "";
if(navigator.userAgent.indexOf("MSIE ") != -1){
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}else{
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}
$(elementId).innerHTML = str;
}
},
// 程序初始化
init:function(){
// Safari不进行操作
if(!!isSafa) return;
var $d = document.compatMode == "BackCompat" ? d = document.body : d = document.documentElement;
if(isIE6) {
this._top = 42, this._left = 204;
this._fixed = Bind(this, function(){this.isCenter ? this.SetCenter() : this.SetFixed();})
}
// 创建Div
this.CreateContainer();
this.Container.style.position = this.isFixed && !isIE6 ? "fixed" : "absolute";
// 如果设置了居中
if(this.isCenter){
this.Container.style.top = this.Container.style.left = "50%";
if(this.isFixed){
this.Container.style.marginTop = - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = - this.Container.offsetWidth / 2 + "px";
}else{
this.SetCenter();
}
}else{ // 如果不居中，则可以自定义位置
this.Container.style.top = this.Container.style.left = "50%";
if(this.isFixed){
this.Container.style.marginTop = - (this.Container.offsetHeight / 2 + this._maxMiddleTop)+ "px";
this.Container.style.marginLeft = - (this.Container.offsetWidth / 2 + this._maxMiddleLeft)+ "px";
}else{
this.SetCenter();
}
}
if(isIE6) {
this.isFixed && addEventHandler(window, "scroll", this._fixed);
}
// 插入Flash
//this.InsertFlash("crazy_maxdiv", this.oMaxFlash_Width, this.oMaxFlash_Height, this.oMaxFlash_Url);
}
}
var yoyi_crazy = new YoYiCrazy();
yoyi_crazy.oMaxContianer_Width = 300;
yoyi_crazy.oMaxFlash_Width = 300;
yoyi_crazy.oMaxFlash_Height = 300;
yoyi_crazy.oMaxFlash_Url = "";
yoyi_crazy._maxMiddleTop = 42;
yoyi_crazy._maxMiddleLeft = 204;
yoyi_crazy.init()
//-->
</script>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>
代码挺长的，但大部分功能多实现了，现在问题是出现在IE6处理定位的问题，大家可以直接看【SetFixed】函数
我的要求就是 在【SetFixed】函数中实现 拖动滚动条 DIV一直出于相对开始的位置。
火狐用fixed属性就可以了 但IE比较麻烦，麻烦的是 我的要求
yoyi_crazy._maxMiddleTop = 42;
yoyi_crazy._maxMiddleLeft = 204;
这两个属性是指 距离中线向上42 和向左204
...全文
请发表友善的回复…
发表回复
Click_Me 2009-05-06
- 打赏
- 举报
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Sohu_Crazy </title>
<meta name="generator" content="editplus" />
</head>
<body>
<script type="text/javascript">
<!--
var isIE = (document.all) ? true : false;
var isIE6 = isIE && ([/MSIE (\d)\.0/i.exec(navigator.userAgent)][0][1] == 6);
var $ = function(sId){
return "string" == typeof(sId) ? document.getElementById(sId) : sId;
}
var Bind = function(object, fun){
return function() {
return fun.apply(object, arguments);
}
}
function addEventHandler(oTarget, sEventType, fnHandler){
if(oTarget.addEventListener){
oTarget.addEventListener(sEventType, fnHandler, false);
}else if(oTarget.attachEvent){
oTarget.attachEvent("on" + sEventType, fnHandler);
}else{
oTarget["on" + sEventType] = fnHandler;
}
}
var isSafa = (window.openDatabase) ? true : false;
var YoYiCrazy = function(){
this.oMaxContianer_Width = 500; // 大DIV宽
this.oMaxContianer_Height = 300; // 大DIV高
this.oSmallContainer_Width = 300; // 小DIV宽
this.oSmallContainer_Height = 300; // 小DIV高
this.oMaxFlash_Width = 500; // 大素材宽
this.oMaxFlash_Height = 300; // 大素材高
this.oMaxFlash_Url = ""; // 大素材地址
this.oMinFlash_Width = 300; // 小素材宽
this.oMinFlash_Height = 300; // 小素材高
this.oMinFlash_Url = ""; // 小素材地址
this.isMaxFollow = false; // 大素材跟随
this.isMinFollow = false; // 小素材跟随
this.isBothShow = false; // 是否同时显示
this.isCenter = false; // 是否居中
this.isFixed = true; // 是否固定定位
this.oCookie_limit_count = 3; // 允许刷新的次数
this.oCookie_Time = new Date().setHours((new Date().getHours() + 24));
//alert(this.oCookie_Time)
if(!this.isCenter){
this._top = 0;
this._left = 0;
}
};
YoYiCrazy.prototype = {
// 创建容器Div
CreateContainer:function(){
document.write("<div id='crazy_maxdiv' style='width:"+this.oMaxContianer_Width+"px;height:"+this.oMaxContianer_Height+"px;z-index:12299;onMouseDown='return false;'></div>");
this.Container = $("crazy_maxdiv");
},
// 兼容IE6的居中定位程序
SetCenter: function(){
this.Container.style.marginTop = d.scrollTop - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = d.scrollLeft - this.Container.offsetWidth / 2 + "px";
},
// 修正IE6的滚动程序
SetFixed: function(){
this.Container.style.top = document.documentElement.scrollTop - this._top + this.Container.offsetTop + "px";
//this.Container.style.left = document.documentElement.scrollLeft - this._left + this.Container.offsetLeft + "px";
this._top = document.documentElement.scrollTop;
},
// 设置Cookie
SetCookie: function(name, value, expires, path, secure) {
document.cookie = name + "=" +escape( value ) +
( ( expires ) ? ";expires=" + expires.toGMTString() : "" ) +
( ( path ) ? ";path=" + path : "" ) +
( ( secure ) ? ";secure" : "" );
},
// 获取Cookie
GetCookie: function( name ){
var start = document.cookie.indexOf( name + "=" );
var len = start + name.length + 1;
if ( ( !start ) && ( name != document.cookie.substring( 0, name.length ) ) )
{
return null;
}
if ( start == -1 ) return null;
var end = document.cookie.indexOf( ";", len );
if ( end == -1 ) end = document.cookie.length;
return unescape( document.cookie.substring( len, end ) );
},
// 插入Flash
InsertFlash:function(elementId,w,h,url){
if($(elementId)){
var str = "";
if(navigator.userAgent.indexOf("MSIE ") != -1){
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}else{
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}
$(elementId).innerHTML = str;
}
},
// 程序初始化
init:function(){
// Safari不进行操作
if(!!isSafa) return;
var $d = document.compatMode == "BackCompat" ? d = document.body : d = document.documentElement;
if(isIE6) {
this._top = 42, this._left = 204;
this._fixed = Bind(this, function(){this.isCenter ? this.SetCenter() : this.SetFixed();})
}
// Cookie操作
var oCookie_Count = this.GetCookie("theCookieSign");
if(oCookie_Count == null){
this.SetCookie("theCookieSign", "1");
}else{
oCookie_Count = parseInt(oCookie_Count) + 1;
this.SetCookie("theCookieSign", oCookie_Count);
}
//
//if(this.GetCookie("theCookieSign") <= this.oCookie_limit_count) {
// 创建Div
this.CreateContainer();
this.Container.style.position = this.isFixed && !isIE6 ? "fixed" : "absolute";
// 如果设置了居中
if(this.isCenter){
this.Container.style.top = this.Container.style.left = "50%";
if(this.isFixed){
this.Container.style.marginTop = - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = - this.Container.offsetWidth / 2 + "px";
}else{
this.SetCenter();
}
}else{ // 如果不居中，则可以自定义位置
this.Container.style.left = "50%";
if(this.isFixed){
this.Container.style.top = this._top + "px";
//this.Container.style.left = this._left+ "px";
//-------------------------------------------------------------------------------------------------------------------------------------------------
alert(this.Container.offsetWidth / 2 +"-----***" +this._left + "----------"+(this.Container.offsetWidth / 2 + this._left)) // -------------为什么IE和FF弹出的this._left结果不一样
//-----------------------------------------------------------------------------------------------------------------------------------------------
this.Container.style.marginLeft = - (this.Container.offsetWidth / 2 + this._left)+ "px";
}else{
this.SetCenter();
}
}
/*if(isIE6) {
this.isFixed && addEventHandler(window, "scroll", this._fixed);
}
*/
// 插入Flash
this.InsertFlash("crazy_maxdiv", this.oMaxFlash_Width, this.oMaxFlash_Height, this.oMaxFlash_Url);
//}
}
}
var yoyi_crazy = new YoYiCrazy();
yoyi_crazy.oMaxContianer_Width = 300;
yoyi_crazy.oMaxFlash_Width = 300;
yoyi_crazy.oMaxFlash_Height = 300;
yoyi_crazy.oMaxFlash_Url = "http://m.test.yoyi/liangchao/Sohu_Crazy_Max.swf";
yoyi_crazy._top = 0;
yoyi_crazy._left = -180;
yoyi_crazy.init()
//-->
</script>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>
大家看下 我//------------------------------注释之间的问题 为什么this._left结果会不一样
Click_Me 2009-05-06
- 打赏
- 举报
[Quote=引用 9 楼 chinmo 的回复:]
引用 5 楼 Click_Me 的回复:
我感觉我这个 跟clou的要求稍有不同。。。。
你不是想在IE下实现fixed这个效果吗？
那他的那个就可以啊
[/Quote]
他的 我没发现可以自定义 DIV的位置
引用 5 楼 Click_Me 的回复:
我感觉我这个 跟clou的要求稍有不同。。。。
你不是想在IE下实现fixed这个效果吗？
那他的那个就可以啊
[/Quote]
他的 我没发现可以自定义 DIV的位置
一把编程的菜刀 2009-05-06
- 打赏
- 举报
[Quote=引用 5 楼 Click_Me 的回复:]
我感觉我这个 跟clou的要求稍有不同。。。。
[/Quote]
你不是想在IE下实现fixed这个效果吗？
那他的那个就可以啊
我感觉我这个 跟clou的要求稍有不同。。。。
[/Quote]
你不是想在IE下实现fixed这个效果吗？
那他的那个就可以啊
cloudgamer 2009-05-06
- 打赏
- 举报
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Sohu_Crazy </title>
<meta name="generator" content="editplus" />
</head>
<body>
<script type="text/javascript">
<!--
var isIE = (document.all) ? true : false;
var isIE6 = isIE && ([/MSIE (\d)\.0/i.exec(navigator.userAgent)][0][1] == 6);
var $ = function(sId){
return "string" == typeof(sId) ? document.getElementById(sId) : sId;
}
var Bind = function(object, fun){
return function() {
return fun.apply(object, arguments);
}
}
function addEventHandler(oTarget, sEventType, fnHandler){
if(oTarget.addEventListener){
oTarget.addEventListener(sEventType, fnHandler, false);
}else if(oTarget.attachEvent){
oTarget.attachEvent("on" + sEventType, fnHandler);
}else{
oTarget["on" + sEventType] = fnHandler;
}
}
var isSafa = (window.openDatabase) ? true : false;
var YoYiCrazy = function(){
this.oMaxContianer_Width = 500; // 大DIV宽
this.oMaxContianer_Height = 300; // 大DIV高
this.oSmallContainer_Width = 300; // 小DIV宽
this.oSmallContainer_Height = 300; // 小DIV高
this.oMaxFlash_Width = 500; // 大素材宽
this.oMaxFlash_Height = 300; // 大素材高
this.oMaxFlash_Url = ""; // 大素材地址
this.oMinFlash_Width = 300; // 小素材宽
this.oMinFlash_Height = 300; // 小素材高
this.oMinFlash_Url = ""; // 小素材地址
this.isMaxFollow = false; // 大素材跟随
this.isMinFollow = false; // 小素材跟随
this.isBothShow = false; // 是否同时显示
this.isCenter = false; // 是否居中
this.isFixed = true; // 是否固定定位
if(!this.isCenter){
this._maxMiddleTop = 0;
this._maxMiddleLeft = 0;
}
};
YoYiCrazy.prototype = {
// 创建容器Div
CreateContainer:function(){
document.write("<div id='crazy_maxdiv' style='width:"+this.oMaxContianer_Width+"px;height:"+this.oMaxContianer_Height+"px;z-index:12299;border:2px solid #D8D8D8' onMouseDown='return false;'></div>");
this.Container = $("crazy_maxdiv");
},
// 兼容IE6的居中定位程序
SetCenter: function(){
alert("dd")
this.Container.style.marginTop = d.scrollTop - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = d.scrollLeft - this.Container.offsetWidth / 2 + "px";
},
// SetFixed: function(){
//
// this.StartPoint = parseInt(this.Container.offsetTop, 10);
// this.EndPoint = d.scrollTop + this.Container.offsetTop;
//
// if(this.StartPoint != this.EndPoint){
// this.ScrollAmount = Math.abs(this.EndPoint - this.StartPoint);
// this.Container.offsetTop = parseInt(this.Container.style.top, 10) + ((this.EndPoint < this.StartPoint) ? -this.ScrollAmount : this.ScrollAmount) + "px";
// }
// },
SetFixed: function(){
this.Container.style.top = d.scrollTop - this._top + this.Container.offsetTop + "px";
this.Container.style.left = d.scrollLeft - this._left + this.Container.offsetLeft + "px";
this._top = d.scrollTop; this._left =d.scrollLeft;
},
// 插入Flash
InsertFlash:function(elementId,w,h,url){
if($(elementId)){
var str = "";
if(navigator.userAgent.indexOf("MSIE ") != -1){
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}else{
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}
$(elementId).innerHTML = str;
}
},
// 程序初始化
init:function(){
// Safari不进行操作
if(!!isSafa) return;
var $d = document.compatMode == "BackCompat" ? d = document.body : d = document.documentElement;
if(isIE6) {
//this._top = 42, this._left = 204;
this._top = 0, this._left = 0;
this._fixed = Bind(this, function(){this.isCenter ? this.SetCenter() : this.SetFixed();})
}
// 创建Div
this.CreateContainer();
this.Container.style.position = this.isFixed && !isIE6 ? "fixed" : "absolute";
// 如果设置了居中
if(this.isCenter){
this.Container.style.top = this.Container.style.left = "50%";
if(this.isFixed){
this.Container.style.marginTop = - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = - this.Container.offsetWidth / 2 + "px";
}else{
this.SetCenter();
}
}else{ // 如果不居中，则可以自定义位置
// this.Container.style.top = this.Container.style.left = "50%";
//
// if(this.isFixed){
// this.Container.style.marginTop = - (this.Container.offsetHeight / 2 + this._maxMiddleTop)+ "px";
// this.Container.style.marginLeft = - (this.Container.offsetWidth / 2 + this._maxMiddleLeft)+ "px";
// }else{
// this.SetCenter();
// }
this.Container.style.top="100px";
this.Container.style.left="100px";
}
if(isIE6) {
this.isFixed && addEventHandler(window, "scroll", this._fixed);
}
// 插入Flash
//this.InsertFlash("crazy_maxdiv", this.oMaxFlash_Width, this.oMaxFlash_Height, this.oMaxFlash_Url);
}
}
var yoyi_crazy = new YoYiCrazy();
yoyi_crazy.oMaxContianer_Width = 300;
yoyi_crazy.oMaxFlash_Width = 300;
yoyi_crazy.oMaxFlash_Height = 300;
yoyi_crazy.oMaxFlash_Url = "";
yoyi_crazy._maxMiddleTop = 42;
yoyi_crazy._maxMiddleLeft = 204;
yoyi_crazy.init()
//-->
</script>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>
其实你想自定义位置的话只要定义this.Container的样式就可以了，例如
this.Container.style.top="100px";
this.Container.style.left="100px";
poemGao 2009-05-06
- 打赏
- 举报
ding
Click_Me 2009-05-06
- 打赏
- 举报
顶下
Click_Me 2009-05-05
- 打赏
- 举报
wtcsy 你测试对么？ 我测试还是不对。。
wtcsy 2009-05-05
- 打赏
- 举报
this.x = (document.body.clientWidth-this.Container.offsetWidth)/-204 ================>>>
this.x = (document.body.clientWidth-this.Container.offsetWidth)/2 - 204
2写掉了
wtcsy 2009-05-05
- 打赏
- 举报
这样吗？？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Sohu_Crazy </title>
<meta name="generator" content="editplus" />
</head>
<body>
<script type="text/javascript">
<!--
var isIE = (document.all) ? true : false;
var isIE6 = isIE && ([/MSIE (\d)\.0/i.exec(navigator.userAgent)][0][1] == 6);
var $ = function(sId){
return "string" == typeof(sId) ? document.getElementById(sId) : sId;
}
var Bind = function(object, fun){
return function() {
return fun.apply(object, arguments);
}
}
function addEventHandler(oTarget, sEventType, fnHandler){
if(oTarget.addEventListener){
oTarget.addEventListener(sEventType, fnHandler, false);
}else if(oTarget.attachEvent){
oTarget.attachEvent("on" + sEventType, fnHandler);
}else{
oTarget["on" + sEventType] = fnHandler;
}
}
var isSafa = (window.openDatabase) ? true : false;
var YoYiCrazy = function(){
this.oMaxContianer_Width = 500; // 大DIV宽
this.oMaxContianer_Height = 300; // 大DIV高
this.oSmallContainer_Width = 300; // 小DIV宽
this.oSmallContainer_Height = 300; // 小DIV高
this.oMaxFlash_Width = 500; // 大素材宽
this.oMaxFlash_Height = 300; // 大素材高
this.oMaxFlash_Url = ""; // 大素材地址
this.oMinFlash_Width = 300; // 小素材宽
this.oMinFlash_Height = 300; // 小素材高
this.oMinFlash_Url = ""; // 小素材地址
this.isMaxFollow = false; // 大素材跟随
this.isMinFollow = false; // 小素材跟随
this.isBothShow = false; // 是否同时显示
this.isCenter = false; // 是否居中
this.isFixed = true; // 是否固定定位
if(!this.isCenter){
this._maxMiddleTop = 0;
this._maxMiddleLeft = 0;
}
};
YoYiCrazy.prototype = {
// 创建容器Div
CreateContainer:function(){
document.write("<div id='crazy_maxdiv' style='width:"+this.oMaxContianer_Width+"px;height:"+this.oMaxContianer_Height+"px;z-index:12299;border:2px solid #D8D8D8' onMouseDown='return false;'></div>");
this.Container = $("crazy_maxdiv");
},
// 兼容IE6的居中定位程序
SetCenter: function(){
alert("dd")
this.Container.style.marginTop = d.scrollTop - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = d.scrollLeft - this.Container.offsetWidth / 2 + "px";
},
SetFixed: function(){
//this.EndPoint = d.scrollTop + this.Container.offsetTop;
//if(this.StartPoint != this.EndPoint){
// this.ScrollAmount = Math.abs(this.EndPoint - this.StartPoint);
// this.Container.offsetTop = parseInt(this.Container.style.top, 10) + ((this.EndPoint < this.StartPoint) ? -this.ScrollAmount : this.ScrollAmount) + "px";
//}
if(!this.y){
this.y = (document.body.clientHeight-this.Container.offsetHeight)/2-42
this.x = (document.body.clientWidth-this.Container.offsetWidth)/-204 //这是绝对居中的 不明白到底该怎么定位
}
this.Container.style.top = this.y+d.scrollTop +'px';
this.Container.style.left = this.x+'px';
},
// 插入Flash
InsertFlash:function(elementId,w,h,url){
if($(elementId)){
var str = "";
if(navigator.userAgent.indexOf("MSIE ") != -1){
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}else{
str += '<embed width="'+ w +'" height="'+ h +'" src="'+ url +'" allowscriptaccess="always" swLiveConnect="true" quality="autohigh" wmode="transparent" type="application/x-shockwave-flash" plugspace="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" id="ofalsh"></embed>';
}
$(elementId).innerHTML = str;
}
},
// 程序初始化
init:function(){
// Safari不进行操作
if(!!isSafa) return;
var $d = document.compatMode == "BackCompat" ? d = document.body : d = document.documentElement;
if(isIE6) {
this._top = 42, this._left = 204;
this._fixed = Bind(this, function(){this.isCenter ? this.SetCenter() : this.SetFixed();})
}
// 创建Div
this.CreateContainer();
this.Container.style.position = this.isFixed && !isIE6 ? "fixed" : "absolute";
// 如果设置了居中
if(this.isCenter){
this.Container.style.top = this.Container.style.left = "50%";
if(this.isFixed){
this.Container.style.marginTop = - this.Container.offsetHeight / 2 + "px";
this.Container.style.marginLeft = - this.Container.offsetWidth / 2 + "px";
}else{
this.SetCenter();
}
}else{ // 如果不居中，则可以自定义位置
this.Container.style.top = this.Container.style.left = "50%";
if(this.isFixed){
this.Container.style.marginTop = - (this.Container.offsetHeight / 2 + this._maxMiddleTop)+ "px";
this.Container.style.marginLeft = - (this.Container.offsetWidth / 2 + this._maxMiddleLeft)+ "px";
}else{
this.SetCenter();
}
}
if(isIE6) {
this.isFixed && addEventHandler(window, "scroll", this._fixed);
this.isFixed && addEventHandler(window, "resize", this._fixed);//最好加个这个事件
}
// 插入Flash
//this.InsertFlash("crazy_maxdiv", this.oMaxFlash_Width, this.oMaxFlash_Height, this.oMaxFlash_Url);
}
}
var yoyi_crazy = new YoYiCrazy();
yoyi_crazy.oMaxContianer_Width = 300;
yoyi_crazy.oMaxFlash_Width = 300;
yoyi_crazy.oMaxFlash_Height = 300;
yoyi_crazy.oMaxFlash_Url = "";
yoyi_crazy._maxMiddleTop = 42;
yoyi_crazy._maxMiddleLeft = 204;
yoyi_crazy.init()
//-->
</script>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/>
</body>
</html>Click_Me 2009-05-05
- 打赏
- 举报
我感觉我这个 跟clou的要求稍有不同。。。。
一把编程的菜刀 2009-05-05
- 打赏
- 举报
呵呵，这个之前讨论过的了，在cloudgamer的博客里貌似也有例子！！
你可以去找找
你可以去找找
Click_Me 2009-05-05
- 打赏
- 举报
CSDN放假？
Click_Me 2009-05-05
- 打赏
- 举报
难道代码太长？
Click_Me 2009-05-05
- 打赏
- 举报
大家可以直接运行我的程序 实现在IE6下 能够固定定位！
