不工作我有一个jQuery的文字动画,在其他浏览器的工作原理,但Safari浏览器在Mac上。有人能告诉我我可能做错了什么吗?当我在背景中包含固定图像时,它似乎停止了在Safari中的工作。这里是我的HTML,CSS和查询。jQuery的动画在Safari
JQUERY:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".boxtext").ready(function(){
$(".boxtext").animate({bottom:"600px"},50000);
});
});
</script>
HTML:
<body>
<div>
<img id="body" src="HomeIBSTVBG2.png"/>
</div>
<div class="container">
<div class="logo">
<img src="IB SportsTV Logo.png" width="240px" height="180px"/>
</div>
<div class="login">
<form action='login.php' method='POST'>
Username: <input type='text' name='username'>
Password: <input type='password' name='password'>
<input type='submit' value='Log in'>
</form>
</div>
<div class="twitterfeed">
<img src="twitter_feedIBSTV.png" width="500px" height="350px"/>
<div class="box">
<p class="boxtext">Make picks, Be the Best!!! Make sports predictions,
compete with your friends and rise to the top of our leaderboards. Make
your mma fighting picks, NFL football picks, and any other sports you want!
Internet Broadcast Sports isn't just a picks game, but we are also a weekly
sports show that encourages you the viewer to give your opinion and make the
topics! You can submit comments, opinions and questions through twitter, our
Viewer Spot section, e-mail, and youtube! Now what are you waiting
for? Sign up NOW!!!
</p>
</div>
</div>
<p>
<div class="register">
<form action='register.php' method='POST'>
<table class="text">
<tr>
<td>
Your full name:
</td>
<td>
<input type='text' name='fullname' value=''>
</td>
</tr>
<tr>
<td>
Choose a username:
</td>
<td>
<input type='text' name='username' value=''>
</td>
</tr>
<tr>
<td>
Choose a password:
</td>
<td>
<input type='password' name='password'>
</td>
</tr>
<tr>
<td>
Confirm Password:
</td>
<td>
<input type='password' name='password2'>
</td>
</tr>
<tr>
<td>
Email:
</td>
<td>
<input type='text' name='email'>
</td>
</tr>
</table>
<p>
<input type='submit' name='submit' value='Register'>
</form>
</div>
</div>
</body>
CSS:
<style type="text/css">
@import url("reset.css");
html, body
{
padding:0px;
margin:0px;
height:100%;
width:100%;
background-color:black;
}
#body
{
padding:0px;
margin:0px;
width:100%;
height:100%;
overflow:hidden;
position:fixed;
top:0;
left:0;
}
.container
{
width: 73.2em;
margin: 0 auto;
position:relative;
}
.login
{
position:absolute;
top:50px;
right:150px;
color:white;
font-family:trajan pro;
}
.register
{
position:absolute;
top:300px;
right:150px;
}
.text
{
color:white;
font-size:20px;
font-weight:bold;
font-family:trajan pro;
}
.logo
{
position:absolute;
top:-20px;
left:100px;
}
.box
{
position:relative;
top:-330px;
left:15px;
overflow:hidden;
width:470px;
height:310px;
}
.boxtext
{
position:absolute;
bottom:-300px;
width:470px;
height:310px;
font-size:25px;
font-family:trajan pro;
color:white;
}
.twitterfeed
{
position:absolute;
top:240px;
left:100px;
}
/*memberpage box properties*/
.gamebox
{
position:absolute;
top:150px;
right:100px;
}
.leaderboardbox
{
position:absolute;
top:165px;
left:100px;
}
.viewerspotbox
{
position:absolute;
top:370px;
left:93px;
}
/*picks page properties*/
.mainform
{
position:absolute;
top:150px;
left:100px;
color:white;
font-family:trajan pro;
border:solid darkblue;
background-color:blue;
}
.form2
{
position:absolute;
top:150px;
right:400px;
color:white;
font-family:trajan pro;
border:solid darkblue;
}
.form3
{
position:absolute;
top:500px;
right:400px;
color:white;
font-family:trajan pro;
border:solid darkblue;
}
.form4
{
position:absolute;
top:850px;
right:400px;
color:white;
font-family:trajan pro;
border:solid darkblue;
}
.form5
{
position:absolute;
top:1200px;
right:400px;
color:white;
font-family:trajan pro;
border:solid darkblue;
}
/*final picks page properties*/
#header
{
position:absolute;
left:0px;
top:0px;
color:white;
}
/*Leaderboard Table Properties*/
.tablehead
{
color:white;
font-family:trajan pro;
background-color:blue;
border-color:darkblue;
}
.tablecontents
{
color:white;
text-align:left;
font-family:trajan pro;
background-color:transparent;
border-color:darkblue;
}
.tableposition
{
position:absolute;
top:250px;
left:150px;
}
caption
{
caption-side:bottom;
color:white;
font-size:42px;
font-family:trajan pro;
}
/*teaser text*/
.teaser
{
color:black;
font-family:trajan pro;
font-size:72px;
position:absolute;
left:450px;
top:250px;
}
</style>
对不起。我只在说明中贴出了带有文字的框。什么阻止了动画文本似乎是我放在背景中的固定图像。我将所有内容都包含在了html部分中,包括背景中的固定图像。 – user830593
我还没有得到一个线索为什么你的jQuery代码不工作必须是我不知道的东西..但我似乎仍然与所有的代码在那里工作。 – Joonas