嘿,我有滑块的JavaScript代码,我的代码在Internet Explorer中工作率为100%,但它不适用于Chrome或Firefox。我的javascript代码不能在Chrome和Firefox中工作
这是我的HTML代码 - >
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="stylesheet" type="text/css" href="styles/Style.css"/>
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/earlyaccess/droidarabickufi.css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="scripts/JS.js"></script>
</head>
<body onload="slidermo0();">
<form id="form1" runat="server">
<div>
<div class="header">
<div class="stmenu">
<ul>
<li> </li>
<li><img src="images/search.png"/><input type="text" /></li>
<li><a href="#">مرحبا</a></li>
</ul>
</div>
<img id="mainimg" src="sss.jpg" />
<img id="logo" src="sss.jpg" />
</div>
<div class="menu">
<ul>
<li><a href="#">الصفحة الرئيسية</a></li>
<li><a href="#">رئيس المجلس</a></li>
</ul>
</div>
<div class="top">
<div class="slider">
<ul>
<li id="s1" onmouseover="slidermo1();" onmouseout="slidermou1();"><h1 id="s1txt">تأجيل محاكمة مرسي لجلسة 1 فبراير لتعذر نقله إلى مقر </h1></li>
<li id="s2" onmouseover="slidermo2();" onmouseout="slidermou2();"><h1 id="s2txt">تأجيل محاكمة مرسي لجلسة 1 فبراير لتعذر نقله </h1></li>
<li id="s3" onmouseover="slidermo3();" onmouseout="slidermou3();"><h1 id="s3txt"> محاكمة مرسي لجلسة 1 فبراير لتعذر نقله إلى مقر المحاكمة </h1></li>
<li id="s4" onmouseover="slidermo4();" onmouseout="slidermou4();"><h1 id="s4txt">تأجيل لجلسة 1 فبراير لتعذر نقله إلى مقر المحاكمة </h1></li>
</ul>
<div class="mimg">
<img id="sim4" src="https://pbs.twimg.com/profile_images/378800000851647346/134bd91486fb1f3dcaf9a94929d08580.jpeg" />
<img id="sim3" src="https://pbs.twimg.com/profile_images/3477392906/f1907df0bd76668deac4a5e31a22fbe7.jpeg" />
<img id="sim2" src="https://pbs.twimg.com/profile_images/378800000777707394/262a47f6acb49b39a454e7f552ad5854.jpeg" />
<img id="sim1" src="https://pbs.twimg.com/profile_images/378800000700068115/a218e2c8dde5b511417034dd5c04f01b.jpeg" />
</div>
<div class="binfo">
<h1 id="smtxt"></h1>
<p>كان اللواء أمين عز الدين، مساعد أول وزير الداخلية مدير أمن الإسكندرية، قد قال إنه «تعذر نقل الرئيس المعزول محمد مرسي إلى مقر محاكمته بأكاديمية ... </p>
</div>
<img id="arrow" src="images/arrow.png" />
</div>
<div class="lnews">
<div class="title">
<span>اخر الاخبار</span>
</div>
</div>
</div>
</div>
</form>
</body>
</html>
,这我的javascript代码===>
var timer = null;
var myimg = "sim1";
var top = "sim2";
function imgslide() {
if (top != myimg) {
document.getElementById("sim1").style.opacity = "0";
document.getElementById("sim2").style.opacity = "0";
document.getElementById("sim3").style.opacity = "0";
document.getElementById("sim4").style.opacity = "0";
document.getElementById("sim1").style.zIndex = "0";
document.getElementById("sim2").style.zIndex = "0";
document.getElementById("sim3").style.zIndex = "0";
document.getElementById("sim4").style.zIndex = "0";
document.getElementById(top).style.opacity = "1";
document.getElementById(top).style.zIndex = "1";
document.getElementById(myimg).style.zIndex = "2";
document.getElementById(myimg).style.opacity = "0";
$("#" + myimg).animate({ opacity: "1" }, "slow");
}
}
function slidermo0() {
myimg = "sim1";
imgslide();
top = "sim1";
document.getElementById("arrow").style.top = "0px";
$("#s1").addClass("liover");
$("#s2").removeClass("liover");
$("#s3").removeClass("liover");
$("#s4").removeClass("liover");
document.getElementById("smtxt").innerText = document.getElementById("s1txt").innerText;
timer = setTimeout(function() { slidermo2(); timer = setTimeout(function() { slidermo3(); timer = setTimeout(function() { slidermo4(); timer = setTimeout(function() { slidermo0() }, 3000); }, 3000); }, 3000); }, 3000);
}
function slidermo1() {
clearTimeout(timer);
myimg = "sim1";
imgslide();
top = "sim1";
document.getElementById("smtxt").innerText = document.getElementById("s1txt").innerText;
document.getElementById("arrow").style.top = "0px";
$("#s1").addClass("liover");
$("#s2").removeClass("liover");
$("#s3").removeClass("liover");
$("#s4").removeClass("liover");
document.getElementById("smtxt").innerText = document.getElementById("s1txt").innerText;
}
function slidermo2() {
clearTimeout(timer);
myimg = "sim2";
imgslide();
top = "sim2";
document.getElementById("smtxt").innerText = document.getElementById("s2txt").innerText;
document.getElementById("arrow").style.top = "81px";
$("#s2").addClass("liover");
$("#s1").removeClass("liover");
$("#s3").removeClass("liover");
$("#s4").removeClass("liover");
}
function slidermo3() {
clearTimeout(timer);
myimg = "sim3";
imgslide();
top = "sim3";
document.getElementById("smtxt").innerText = document.getElementById("s3txt").innerText;
document.getElementById("arrow").style.top = "163px";
$("#s3").addClass("liover");
$("#s1").removeClass("liover");
$("#s2").removeClass("liover");
$("#s4").removeClass("liover");
}
function slidermo4() {
clearTimeout(timer);
myimg = "sim4";
imgslide();
top = "sim4";
document.getElementById("smtxt").innerText = document.getElementById("s4txt").innerText;
document.getElementById("arrow").style.top = "245px";
$("#s4").addClass("liover");
$("#s1").removeClass("liover");
$("#s2").removeClass("liover");
$("#s3").removeClass("liover");
}
function slidermou1() {
slidermo0();
myimg = "sim2";
}
function slidermou2() {
timer = setTimeout(function() { slidermo3(); timer = setTimeout(function() { slidermo4(); timer = setTimeout(function() { slidermo0() }, 3000); }, 3000); }, 3000);
myimg = "sim3";
}
function slidermou3() {
timer = setTimeout(function() { slidermo4(); timer = setTimeout(function() { slidermo0(); }, 3000); }, 3000);
myimg = "sim4";
}
function slidermou4() {
timer = setTimeout(function() { slidermo0(); }, 3000);
myimg = "sim1";
}
,这我的代码演示,只是看滑块 - > http://schools.org.il/Default2.aspx
我有我的问题寻找解决方案2天,但我没有找到它,任何一个可以帮助吗?!
代码伤害我的眼睛:/ – Doorknob
边注:使代码更混乱/古怪考虑使用'document.write'太:)...为什么你正在使用JQuery的这种随意的搭配和原始JavaScript代替CSS? –