javascript中两疑难有关问题，各30分，请求解决
日期：2014-05-16 浏览次数：20365 次
javascript中两疑难问题，各30分，请求解决
一、页面定位的问题
<a href= "# "> <img alt= "加粗 " src= "Image/bold.gif " border= "0 " onclick= "Bold(); " /> </a>
图片中有一个单击事件，当我单击图片时，垂直滚动条就跑到页面顶部了，如果执行该事件使页面位置保持不变(要求：兼容firefox)？
二、动态显示菜单的位置问题
HTML 代码：
<a href= "# " onmouseover= "changeSkin(event) "> 风 格 </a>
JS代码：
function changeSkin(oEvent)
{
var oDiv=document.getElementById( "skinMenu ");
oDiv.style.visibility= "visible ";
oDiv.style.left=oEvent.clientX+5;
oDiv.sty
此段代码在ie中执行成功，在firefox中无法定位（即无法将div层显示在鼠标的底部）
该如何修改才能在firefox中执行成功
------解决方案--------------------
1. <a href= "javascript:void(0) ">
2.http://zhidao.baidu.com/question/31251229.html
------解决方案--------------------
第二个问题是event的标准问题
在ie中用event
在ff中是作为第一个参数传递的，也就是
changeSkin(event)
function changeSkin(event)
这里都用event来替换，应该可以兼容了
------解决方案--------------------
二、动态显示菜单的位置问题
我以前做的一个例子:
<!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>
<meta http-equiv= "Content-Type " content= "text/html; charset=utf-8 " />
<title> 无标题文档-SH! </title>
<style type= "text/css ">
<!--
body {
margin:0px;
padding:0px;
}
.tagDiv {
position:absolute;
padding:2px;
z-index:101;
background-color: #CCFF99;
display:inline;
filter: Alpha(opacity=80);
-moz-opacity:.8;
opacity:0.8;
font-size:12px;
font-family: "宋体 ", Arial, sans-serif;
}
#bgImg{
cursor:crosshair;
}
#apDiv1{
cursor:pointer;
}
#selBox {
position:absolute;
width:600px;
height:450px;
z-index:1;
visibility: visible;
overflow: hidden;
}
#bgImg{
}
#apDiv1 {
position:absolute;
left:0px;
top:0px;
padding:2px;
z-index:101;
background-color: #CCFF99;
display:inline;
filter: Alpha(opacity=60);
-moz-opacity:.6;
opacity:0.6;
font-size:12px;
font-family: "宋体 ", Arial, sans-serif;
}
-->
</style>
<script language= "javascript ">
function $(element) {
if (arguments.length > 1)
{
for (var i = 0, elements = [], length = arguments.length; i < length; i++)
elements.push($(arguments[i]));
return elements;
}
if (typeof element == 'string ')
{
if (document.getElementById)
{
element = document.getElementById(element);
}
else if (document.all)
{
element = document.all[element];
}
else if (document.layers)
{
element = document.layers[element];
}
}
return element;
}
</script>
<script language= "javascript ">
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
return temp;
}
一、页面定位的问题
<a href= "# "> <img alt= "加粗 " src= "Image/bold.gif " border= "0 " onclick= "Bold(); " /> </a>
图片中有一个单击事件，当我单击图片时，垂直滚动条就跑到页面顶部了，如果执行该事件使页面位置保持不变(要求：兼容firefox)？
二、动态显示菜单的位置问题
HTML 代码：
<a href= "# " onmouseover= "changeSkin(event) "> 风 格 </a>
JS代码：
function changeSkin(oEvent)
{
var oDiv=document.getElementById( "skinMenu ");
oDiv.style.visibility= "visible ";
oDiv.style.left=oEvent.clientX+5;
oDiv.sty
此段代码在ie中执行成功，在firefox中无法定位（即无法将div层显示在鼠标的底部）
该如何修改才能在firefox中执行成功
------解决方案--------------------
1. <a href= "javascript:void(0) ">
2.http://zhidao.baidu.com/question/31251229.html
------解决方案--------------------
第二个问题是event的标准问题
在ie中用event
在ff中是作为第一个参数传递的，也就是
changeSkin(event)
function changeSkin(event)
这里都用event来替换，应该可以兼容了
------解决方案--------------------
二、动态显示菜单的位置问题
我以前做的一个例子:
<!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>
<meta http-equiv= "Content-Type " content= "text/html; charset=utf-8 " />
<title> 无标题文档-SH! </title>
<style type= "text/css ">
<!--
body {
margin:0px;
padding:0px;
}
.tagDiv {
position:absolute;
padding:2px;
z-index:101;
background-color: #CCFF99;
display:inline;
filter: Alpha(opacity=80);
-moz-opacity:.8;
opacity:0.8;
font-size:12px;
font-family: "宋体 ", Arial, sans-serif;
}
#bgImg{
cursor:crosshair;
}
#apDiv1{
cursor:pointer;
}
#selBox {
position:absolute;
width:600px;
height:450px;
z-index:1;
visibility: visible;
overflow: hidden;
}
#bgImg{
}
#apDiv1 {
position:absolute;
left:0px;
top:0px;
padding:2px;
z-index:101;
background-color: #CCFF99;
display:inline;
filter: Alpha(opacity=60);
-moz-opacity:.6;
opacity:0.6;
font-size:12px;
font-family: "宋体 ", Arial, sans-serif;
}
-->
</style>
<script language= "javascript ">
function $(element) {
if (arguments.length > 1)
{
for (var i = 0, elements = [], length = arguments.length; i < length; i++)
elements.push($(arguments[i]));
return elements;
}
if (typeof element == 'string ')
{
if (document.getElementById)
{
element = document.getElementById(element);
}
else if (document.all)
{
element = document.all[element];
}
else if (document.layers)
{
element = document.layers[element];
}
}
return element;
}
</script>
<script language= "javascript ">
Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
return temp;
}
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
