1
我的任務是設置縮略圖圖像爲不透明度爲30％，持續時間爲0.5秒。我對此非常陌生，不確定我是否做得對。任何人都可以建議我在js文件中的代碼？在0.5秒的時間內設置不透明度爲30％
<!DOCTYPE html>
<html>
<body>
<script>
$(document).ready(function(){
// Add the hover handler to the link
$("#imageCS").hover(
function(){ // When mouse pointer is above the link
// Make the image inside link to be transparent
$(this).find("images/boxImage1").animate(
{opacity:"0.3"},
{duration:500}
);
},
function(){ // When mouse pointer move out of the link
// Return image to its previous state
$(this).find("images/boxImage1").animate(
{opacity:"1"},
{duration:300}
\t \t
$(document).ready(function(){
// Add the hover handler to the link
$("#imageCS").hover(
function(){ // When mouse pointer is above the link
// Make the image inside link to be transparent
$(this).find("images/boxImage2").animate(
{opacity:"0.3"},
{duration:500}
);
},
function(){ // When mouse pointer move out of the link
// Return image to its previous state
$(this).find("images/boxImage1").animate(
{opacity:"1"},
{duration:300}
$(document).ready(function(){
// Add the hover handler to the link
$("#imageCS").hover(
function(){ // When mouse pointer is above the link
// Make the image inside link to be transparent
$(this).find("images/boxImage1").animate(
{opacity:"0.3"},
{duration:500}
);
},
function(){ // When mouse pointer move out of the link
// Return image to its previous state
$(this).find("images/boxImage3").animate(
{opacity:"1"},
{duration:300}
</html>
</body>
</script><!doctype html>
<html>
<head lang="en">
\t <meta charset="utf-8">
\t <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
\t <title>TMA</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="main.css" rel="stylesheet" type="text/css"/>
<link href="myStyle.css" rel="stylesheet" type="text/css"/>
<script src="jquery.js"></script>
<script src="myScript.js"></script>
</head>
<body>
<div id="socialmediafloat">
<img src="images/facebook.png" id="facebook_icon" class="media_icons"/>
<img src="images/twitter.png" id="twitter_icon" class="media_icons"/>
<img src="images/youtube.png" id="youtube_icon" class="media_icons"/>
<img src="images/pinterest.png" id="pinterest_icon" class="media_icons"/>
</div>
<div id="myheader">
\t <div id="header" class="container">
\t \t <div id="logo">
\t \t \t <h1><a href="http://www.unisim.edu.sg/Pages/UniSIM.aspx"><img src="images/UniSIM.JPG"/></a></h1>
\t \t </div>
\t </div>
\t <div id="highlights" class="container">
\t \t <div class="title">
\t \t \t <h1>Discover The UniSIM Advantage</h1>
\t \t \t <span class="byline">Are you ready to open your mind to more possibilities, give yourself the opportunities that you've always wanted, and quench your thirst for knowledge? No matter what it is, whether to give yourself a second chance in your career or to provide for a better life for yourself and your loved ones, further education with UniSIM will get you there.</span>
\t \t </div>
\t </div>
</div>
<div id="content">
\t <div id="myCols" class="container">
\t \t <div class="col1">
<img src="images/boxImage1.jpg" class="imageCS"/>
\t \t \t <p>Whatever your goals, background or life stage, we believe in you, and we will equip you with the real-world knowledge and practice-oriented skills to excel, both in life and in your chosen career.</p>
\t \t \t <button id="col1btn" class="button">Discover</button>
\t \t </div>
\t \t <div class="col2">
<img src="images/boxImage2.png" class="imageCS"/>
\t \t \t <p>With a range of more than 50 degree programmes in various disciplines, we focus on equipping our students with a competitive advantage in their industries. Explore the programmes we offer from our five schools and embark on your learning journey now.</p>
\t \t \t <button id="col2btn" class="button">Programmes</button>
\t \t </div>
\t \t <div class="col3">
<img src="images/boxImage3.jpg" class="imageCS"/>
\t \t \t <p>SIM University (UniSIM) offers government-funded, full-time direct honours programme for school leavers. A full-time degree can normally be completed in 4 years although the maximum period of candidature is 6 years.</p>
\t \t \t <button id="col3btn" class="button">Education</button>
\t \t </div>
\t </div>
</div>
<div id="details">
\t <div class="container">
<p>BSc Multimedia Technology and Design</p>
<table id="MTDSchedule">
<tr>
<th></th>
<th>Code</th>
<th>Name</th>
<th>Credit Units</th>
<th>Time Table</th>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>ICT271</td>
<td>Introductory Programming Techniques in C++</td>
<td>5</td>
<td>Thursday/Week 1/Term 1</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD105e</td>
<td>Digital Photography Techniques</td>
<td>5</td>
<td>Friday/Week 2/Term 1</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD111e</td>
<td>Creative Design Fundamentals</td>
<td>5</td>
<td>Wednesday/Week 1/Term 1</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD113e</td>
<td>History of Media</td>
<td>5</td>
<td>Wednesday/Week 1/Term 2</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD201e</td>
<td>Fundamentals of Graphics Design</td>
<td>5</td>
<td>Tuesday/Week 1/Term 1</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD203e</td>
<td>Advanced Graphics Design</td>
<td>5</td>
<td>Tuesday/Week 2/Term 2</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD205e</td>
<td>Audio Technology</td>
<td>5</td>
<td>Wednesday/Week 1/Term 1</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD207e</td>
<td>Video Technology</td>
<td>5</td>
<td>Wednesday/Week 1/Term 2</td>
</tr>
<tr>
<td> <input type="checkbox"/></td>
<td>MTD215</td>
<td>Application of C++ in Multimedia</td>
<td>5</td>
<td>Wednesday/Week 1/Term 2</td>
</tr>
</table>
<button class="button">Reset</button>
</div> \t
</div>
<div id="footer" class="container">
<p>© All rights reserved. | SIM University</p>
</div>
</body>
</html>
告訴我們你的代碼呢？ –
也許你可以最小化它，這樣只有相關的代碼被看到，我們可以隨時測試它。 –