亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

有疑問求解答

看第三章箭頭切換視頻,按照視頻打代碼,為什么那個箭頭可以顯現卻不能切換?下的代碼怎么感覺比視頻更難。是因為缺少那個文件夾的內容嗎?http://img1.sycdn.imooc.com//565ed11a00017a2305540085.jpg

正在回答

2 回答


<!DOCTYPE html> ? ?

<html> ? ?

<head> ? ?

<meta charset="utf-8" /> ? ?

<title>無標題文檔</title> ? ?

<style type="text/css"> ? ?

*{margin:0;padding:0; ? ?

text-decoration:none;} ? ?

boby { padding: 20px;} ? ?

#container { width: 600px; height: 400px; border: 3px solid #333; overflow: hidden; position: relative;} ? ?

#list { width: 4200px; height: 400px; position: absolute; z-index: 1;} ? ?

#list img { float: left;} ? ?

#buttons { position: absolute; height: 10px; width: 100px; z-index: 2; bottom: 20px; left: 250px;} ? ?

#buttons span { cursor: pointer; float: left; border: 1px solid #fff; width: 10px; height: 10px; border-radius: 50%; background: #333; margin-right: 5px;} ? ?

#buttons .on { ?background: orangered;} ? ?

.arrow { cursor: pointer; display: none; line-height: 39px; text-align: center; font-size: 36px; font-weight: bold; width: 40px; height: 40px; ?position: absolute; z-index: 2; top: 180px; background-color: RGBA(0,0,0,.3); color: #fff;} ? ?

.arrow:hover { background-color: RGBA(0,0,0,.7);} ? ?

#container:hover .arrow { display: block;} ? ?

#prev { left: 20px;} ? ?

#next { right: 20px;} ? ?

</style> ? ?

<script type="text/javascript"> ? ?

window.onload=function(){ ? ?

var container = document.getElementById('container'); ? ?

var list = document.getElementById('list'); ? ?

var buttons = document.getElementById('buttons ').getElementsByTagName('span'); ? ?

var prev = document.getElementById('prev'); ? ?

var next = document.getElementById('next'); ? ?

function animate(offset){ ? ?

list.style.left=parseInt(list.style.left)+offset+'px'; ? ?

} ? ?

next.onclick=function(){ ? ?

animate(-600); ? ?

? ?

} ? ?

prev.onclick=function(){ ? ?

animate(600); ? ?

} ? ?

? ?

} ? ?

</script> ? ?

<boby> ? ?

<div id="container"> ? ?

<div id="list" style="left: -600px;"> ? ?

<img src="img/5.jpg" alt="1"/> ? ?

<img src="img/1.jpg" alt="1"/> ? ?

<img src="img/2.jpg" alt="2"/> ? ?

<img src="img/3.jpg" alt="3"/> ? ?

<img src="img/4.jpg" ?alt="4"/> ? ?

<img src="img/5.jpg" ?alt="5"/> ? ?

<img src="img/1.jpg" ?alt="5"/> ? ?

</div> ? ?

<div id="buttons"> ? ?

<span index="1" class="on"></span> ? ?

<span index="2"></span> ? ?

<span index="3"></span> ? ?

<span index="4"></span> ? ?

<span index="5"></span> ? ?

</div> ? ?

<a href="javascript:;" id="prev" class="arrow">&lt;</a> ? ?

<a href="javascript:;" id="next" class="arrow">&gt;</a> ? ?

</div> ? ?

</body> ? ?

</html> ? ?


0 回復 有任何疑惑可以回復我~

你把你自己寫的代碼都帖出來,大家幫你看一下呀!

0 回復 有任何疑惑可以回復我~
#1

橙子lovesun 提問者

我的代碼帖出來了,幫我看看吧。謝謝。請問下那個效果你按照視頻做出來了嗎?
2015-12-03 回復 有任何疑惑可以回復我~

舉報

0/150
提交
取消
焦點圖輪播特效
  • 參與學習       65333    人
  • 解答問題       638    個

通過本教程學習您將能掌握非常實用的焦點圖輪播特效的制作過程

進入課程

有疑問求解答

我要回答 關注問題
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號