不工作我有一個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