課程
/前端開發(fā)
/JavaScript
/Tab選項卡切換效果
怎么給它加加個左右按鈕,可以點擊切換的,求告知
2017-12-03
源自:Tab選項卡切換效果 4-1
正在回答
<!--
? ? ? ? ? ? ? ? ?<:HTML字符轉(zhuǎn)義,代表"<"
? ? ? ? ? ? ? ? ?>:HTML字符轉(zhuǎn)義,代表">"
-->
<a href="javascript:;" id="prev" class="arrow"><</a>
<a href="javascript:;" id="next" class="arrow">></a>
css部分:
.arrow{
width: 30px;
height: 30px;
background-color: rgba(0,0,0,0.3);
cursor: pointer;
/*opacity: 0.6;*/
color: #FFFFFF;
text-align: center;
line-height: 30px;
font-size: 16px;
}
#prev{
position: absolute;
top: 40%;
left:5px;
#next{
right:5px;
js部分:
var prev=document.getElementById("prev");
var next=document.getElementById("next");
prev.onclick=function(){
index--;
if(index<0){
index=4;
? ? ? ? change(index);
? ? ? ? if(timer){
? ? ? ? clearInterval(timer);
? ? ? ? timer=null;
? ? ? ? }
? ? ? ? timer=setInterval(autoPlay,2000);
next.onclick=function(){
index++;
if(index>4){
index=0;
change(index);
if(timer){
舉報
本課程詳細介紹網(wǎng)頁頁面中最流行常用的tab切換效果
4 回答焦點圖輪播 鼠標離開后圖片混亂播放
3 回答焦點輪播圖效果實現(xiàn)
2 回答同一個頁面怎么同時使用倆個輪播
3 回答我的輪播效果出了問題,誰可以幫我看一下
1 回答跳動不正常。沒點擊之前是正常的,點擊之后就快速閃
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學習伙伴
掃描二維碼關注慕課網(wǎng)微信公眾號
2018-01-06
<!--
? ? ? ? ? ? ? ? ?<:HTML字符轉(zhuǎn)義,代表"<"
? ? ? ? ? ? ? ? ?>:HTML字符轉(zhuǎn)義,代表">"
-->
<a href="javascript:;" id="prev" class="arrow"><</a>
<a href="javascript:;" id="next" class="arrow">></a>
css部分:
.arrow{
width: 30px;
height: 30px;
background-color: rgba(0,0,0,0.3);
cursor: pointer;
/*opacity: 0.6;*/
color: #FFFFFF;
text-align: center;
line-height: 30px;
font-size: 16px;
}
#prev{
position: absolute;
top: 40%;
left:5px;
}
#next{
position: absolute;
top: 40%;
right:5px;
}
js部分:
var prev=document.getElementById("prev");
var next=document.getElementById("next");
prev.onclick=function(){
index--;
if(index<0){
index=4;
}
? ? ? ? change(index);
? ? ? ? if(timer){
? ? ? ? clearInterval(timer);
? ? ? ? timer=null;
? ? ? ? }
? ? ? ? timer=setInterval(autoPlay,2000);
}
next.onclick=function(){
index++;
if(index>4){
index=0;
}
change(index);
if(timer){
? ? ? ? clearInterval(timer);
? ? ? ? timer=null;
? ? ? ? }
? ? ? ? timer=setInterval(autoPlay,2000);
}