个人中心
文章发布
退出
作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用？
- database - RESTful URI 是否应该公开数据库主键？
24
4
今天晚上我非常努力地试图理解 html 位置和 jquery 动画，我做了一个 HTML 页面，如下所示:
<html>
<head>
<script src="jquery-1.5.1.min.js" type="text/javascript"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
body {
background-image: url(Cartoon_Landscape2.jpg);
}
</style>
<script type="text/javascript">
function moveDIV ( obj, x, y ) {
var element = document.getElementById(obj);
element.style.left=x;
element.style.top=y;
}
var t;
function anim1()
{
moveDIV("mariposa", screen.availWidth, screen.availHeight);
$("#mariposa").animate({left: '-84', top: '-58'}, 10000);
t=setTimeout("anim1()",22000);
//moveDIV("mariposa2", '-84', screen.availHeight);
//$("#mariposa2").animate({left: screen.availWidth, top: '-58'}, 10000);
}
function anim2()
{
moveDIV("mariposa2", '-84', screen.availHeight);
$("#mariposa2").animate({left: screen.availWidth, top: '-58'}, 10000);
t=setTimeout("anim2()",22000);
}
function callfunctions()
{
moveDIV("mariposa2", '-84', screen.availHeight);
anim1();
var b=setTimeout("anim2()",11000);
}
</script>
</head>
<body onLoad="javascript:callfunctions();" >
<div id="mariposa" style="position:fixed; overflow: hidden;">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,0,0" name="mariposa" width="84" height="58" align="top">
<param name=movie value="mariposa.swf">
<param name=wmode value=transparent>
<param name=quality value=high>
<embed src="mariposa.swf" width="84" type="application/x-shockwave-flash" height="58" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" wmode="transparent" align="top" name="mariposa">
</embed>
</object>
</div>
<div id="mariposa2" style="position:fixed; overflow: hidden;">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,0,0" name="mariposa2" width="-84" height="58" align="top">
<param name=movie value="mariposa2.swf">
<param name=wmode value=transparent>
<param name=quality value=high>
<embed src="mariposa2.swf" width="84" type="application/x-shockwave-flash" height="58" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" wmode="transparent" align="top" name="mariposa2">
</embed>
</object>
</div>
</body>
</html>
因此页面从屏幕的左侧和右侧显示一个对 Angular 线运动的 flash 动画。
对我来说非常完美，在 firefox、opera、safari、chome 上运行良好，但在 internet explorer 8 上运行不佳!!，我该怎么做才能解决这个问题？ =(
附言如果我在两个 DIV 中都使用绝对位置，则动画可以在 Internet Explorer 上运行，但会创建不必要的滚动条。
谢谢
最佳答案
我在您的示例代码中看到一些可能导致各种问题的事情:
首先，您几乎没有使用任何 jQuery。既然您已经在使用 jQuery，那么您不妨充分利用它，从而避免很多麻烦。例如，除了实现您自己的 moveDIV() 函数，您还可以使用:
$("#id").css({left: 10, top: 10});
几乎完全符合您在代码中使用 .animate() 的方式。您还可以为此使用 offset() ，具体取决于什么对您更好:
$("#id").offset({left: 10, top: 10});
了解 .offset() , .css() 和 .animate() 在jQuery API docs .
顺便说一句，而不是使用:
setTimeout("anim1()",22000);
最好用:
setTimeout(anim1, 22000);
它做同样的事情，但效率更高。
您可以尝试使用 position: absolute 进行试验或 position: relative你在哪里position: fixed .
您没有文档类型，IE 可能会尝试以怪癖模式呈现您的页面。要使用标准模式，请在 HTML 的最开头添加文档类型:<!doctype html>
事实上，如果 IE8 认为它对您的网站更好，它甚至可以使用 IE7 渲染引擎。如果你想确保你总是被 IE 中最好的渲染引擎渲染，你还应该添加:<meta http-equiv="X-UA-Compatible" content="IE=Edge">
此外，当您确保您的网站在 IE8 上运行时，您还可以使用 Google Chrome Frame插件(如果可用):<meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1">
总而言之，您的 HTML 的开头应如下所示
<!doctype html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1" >
... and the rest of your HTML
这些只是我在您的代码中看到的您可能考虑更改的主要内容。我不知道这样做是否能解决您的问题，但即使不能解决，您以后也不必再处理其他问题。
关于javascript - jquery 动画和 Internet Explorer 8 的问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5176474/
24
4
0
像其他人一样，我需要在 Internet Explorer 6 和 Internet Explorer 7 上测试我的代码。现在，Internet Explorer 8 为开发人员提供了一些很棒的工具
我已经浏览了几个小时的注册表，但似乎无法找到控制 Internet Explorer 临时 Internet 文件设置的注册表。我想从自动更改为其他内容。 最佳答案 HKCU\Software\Mic
这个问题在这里已经有了答案: 10年前关闭。 Possible Duplicate: Running Internet Explorer 6, Internet Explorer 7, and Int
作为一名开发者，我发现新的 Internet Explorer 版本完全是一场噩梦。我关闭了 Windows 功能，但无法安装 Internet Explorer 10 。它说它已经安装，但事实并非如
是否有任何分析器工具可以调试DOM中的哪个javascript /对象导致Internet Explorer挂起/崩溃。 CPU使用率将超过60％，我想知道其背后的原因，是哪个脚本/ Flash Ob
我正在尝试确定Internet Explorer上TTF字体格式的支持状态。 (我手头没有任何Windows计算机可以尝试。)The table at caniuse指出，从版本9开始的IE支持TTF
是否可以在 Internet Explorer 中切换多个版本的 JDK/JRE？ 想要使用 jdk 1.4、jdk 5 和 jdk 6。 谢谢，迈克尔 最佳答案 据我所知，这并不容易做到，因为 IE
这应该是IE8下载问题的老问题了。我使用 PHP 来设置响应头，如: header("Pragma: public"); header("Expires: 0"); header("Content-t
这个问题在这里已经有了答案: 10年前关闭。 Possible Duplicate: Running Internet Explorer 6, Internet Explorer 7, and Int
我正在使用新的Internet Explorer 11开发人员工具将文档模式切换为“8”，但条件注释仍然被忽略，也就是说，它们没有被正确解析并且表现得像普通注释。因此，浏览器不会请求/加载条件注释内的
我在我的一个站点上遇到 Internet Explorer 6 问题，我真的希望我安装它而不是 Internet Explorer 7。有没有一种快速的方法来做到这一点？ 最佳答案 下载Microso
关闭。这个问题需要debugging details .它目前不接受答案。 编辑问题以包含 desired behavior, a specific problem or error, and t
如何访问 Internet Explorer 运行实例的经典 Internet Explorer COM 自动化对象？也就是说，如果我在多个窗口中打开 Internet Explorer，如何从 Po
string filename = Server.UrlPathEncode(Path.GetFileName(_Filename))); Response.AddHeader("Content-Di
当我尝试使用 Apache 2.2 在 Windows7(64 位)上的 IE9 或 IE10 中打开 localhost 时，解析 URL 需要很长时间。其他浏览器没有问题并立即解析 URL，只有
我有一个批处理文件，必须启动 Internet Explorer 并打开 www.google.com .当整个页面加载完成时，它应该终止 IE 进程，即关闭该系统中的所有 IE 实例。我的批处理文件
关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。 想改善这个问题吗？更新问题，使其成为 on-topic对于堆栈溢出。 6 个月前关闭。 Improve t
基本上，无论我使用 IE 访问哪个网站，我都可以看到那些黑色/白色形状，一旦我将鼠标移到它们上，它们就会消失。 想知道是否有人知道可能导致这种情况的原因？ 另外:http://imageshack.c
我检查了所有注册表，但找不到所有已安装扩展的列表。 此时，IE 扩展/加载项的任何一般位置都会有所帮助。 最佳答案 取自 here : 浏览器帮助对象 - 旨在增强浏览器功能的浏览器插件。 条目可以在
这是一个两部分的问题。我正在构建一个网页，我需要知道: 有没有办法检测 IE 是否启用了平滑滚动(如果是，如何)？ 有没有办法强制 IE 关闭我网页的平滑滚动功能？ 明确地说，我不是在问如何关闭整个计
我是一名优秀的程序员,十分优秀！