修正菜单被下拉框遮住的弊端

在动网的许多页面中,若遇选择性下拉框与下拉菜单相邻,通常会下拉菜单会出现部份被选择下拉框挡住的现象。如图所示:

此主题相关图片如下:
按此在新窗口浏览图片
经过在网上查找相关文档,找到一种利用垫片技术,可修正此弊端。如下图所示:

此主题相关图片如下:
按此在新窗口浏览图片

修改方法:
1、打开in/main.js文件,在文件最后其中增加如下几个函数:
//Opens a shim, if no shim exists for the menu, one is created
function openShim(menu,menuItem)
{
if (menu==null) return;
var shim = getShim(menu);
if (shim==null) shim = createMenuShim(menu,getShimId(menu));

//Change menu zIndex so shim can work with it
menu.style.zIndex = 100;

var width = (menu.offsetWidth == 0 ? menuItem.renderedWidth : menu.offsetWidth);
var height;

if (menu.offsetHeight == 0)
{
var menus = getMenuItemCount(menu);
height = menuItem.renderedHeight * menus;
}
else
{
var height = menu.offsetHeight;
}

shim.style.width = width;
shim.style.height = height;
shim.style.top = menu.style.top;
shim.style.left = menu.style.left;
shim.style.zIndex = menu.style.zIndex - 1;
shim.style.position = "absolute";
shim.style.display = "block";
}

//Closes the shim associated with the menu
function closeShim(menu)
{
if (menu==null) return;
var shim = getShim(menu);
if (shim!=null) shim.style.display = "none";
}

//Creates a new shim for the menu
function createMenuShim(menu)
{
if (menu==null) return null;

var shim = document.createElement("<iframe scrolling='no' frameborder='0'"+
"style='position:absolute; top:0px;"+
"left:0px; display:none'></iframe>");
shim.name = getShimId(menu);
shim.id = getShimId(menu);
//Unremark this line if you need your menus to be transparent for some reason
//shim.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)";

if (menu.offsetParent==null || menu.offsetParent.id=="")
{
window.document.body.appendChild(shim);
}
else
{
menu.offsetParent.appendChild(shim);
}

return shim;
}

//Creates an id for the shim based on the menu id
function getShimId(menu)
{
if (menu.id==null) return "__shim";
return "__shim"+menu.id;
}

//Returns the shim for a specific menu
function getShim(menu)
{
return document.getElementById(getShimId(menu));
}

2、添加好上述函数后,仍在该文件中查找到:
menuobj.thestyle.visibility="visible"
在其后增加一行:openShim(menuobj,vmenuobj)
继续查找到:
function ie_clearshadow()
{
for(var i=0;i<fo_shadows.length;i++)
{
if (fo_shadows[i])
fo_shadows[i].style.display="none";
}
fo_shadows=new Array();
}
将其改为:
function ie_clearshadow()
{
for(var i=0;i<fo_shadows.length;i++)
{
if (fo_shadows[i])
fo_shadows[i].style.display="none";
}
closeShim(window.menuobj) ;/////我将其改为closeShim(menuobj) ;
fo_shadows=new Array();
}


我在网上搜到的,自己用了一下成功了,大家一起分享!

posted on 2007-08-01 15:53  youlijiang  阅读(610)  评论(2编辑  收藏  举报