会员可以在此提问,百战程序员老师有问必答
对大家有帮助的问答会被标记为“推荐”
看完课程过来浏览一下别人提的问题,会帮你学得更全面
截止目前,同学们一共提了 132465个问题
Python 全系列/第十五阶段:Python 爬虫开发/docker 容器扩展(旧) 15797楼
Python 全系列/第十三阶段:高并发性能怪兽-Tornado 框架/Tornado 深入学习(旧) 15799楼
Python 全系列/第一阶段:Python入门/编程基本概念 15800楼
JAVA 全系列/第一阶段:JAVA 快速入门/飞机大战小项目训练 15801楼

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>百叶窗</title>    <style>        *{            margin: 0px;            padding: 0px;        }        .containor{            width: 800px;            height: 300px;            margin: 80px auto;            position: relative;            border: 1px solid red;            overflow: hidden;        }        .containor ul{            list-style: none;        }        .containor ul li{            position: absolute;        }        .cover{            width: 100%;            height: 300px;            background: rgba(0,0,0,0.5);            position: absolute;        }        .li1{            left: 160px;        }        .li2{            left: 320px;        }        .li3{            left: 480px;        }        .li4{            left: 640px;        }    </style></head><body><div class="containor">    <ul>        <li class="li0"><div class="cover"></div><img src="img/0(1).jpg" alt=""></li>        <li class="li1"><div class="cover"></div><img src="img/1.jpg" alt=""></li>        <li class="li2"><div class="cover"></div><img src="img/2.jpg" alt=""></li>        <li class="li3"><div class="cover"></div><img src="img/3.jpg" alt=""></li>        <li class="li4"><div class="cover"></div><img src="img/4.jpg" alt=""></li>    </ul></div><script>    var $lis=$(".containor ul li");    $lis.mouseenter(function () {         $(this).find(".cover").stop(true).fadeOut()    }).mouseleave(function () {        $lis.stop(true);        $(this).find(".cover").stop(true).fadeIn()        $lis.eq(1).animate({"left":160},500)        $lis.eq(2).animate({"left":320},500)        $lis.eq(3).animate({"left":480},500)        $lis.eq(4).animate({"left":640},500)    })    $(".li0").mouseenter(function () {        $lis.stop(true);        $lis.eq(1).animate({"left":560},500)        $lis.eq(2).animate({"left":620},500)        $lis.eq(3).animate({"left":680},500)        $lis.eq(4).animate({"left":740},500)    })    $(".li1").mouseenter(function () {        $lis.stop(true);        $lis.eq(1).animate({"left":60},500)        $lis.eq(2).animate({"left":620},500)        $lis.eq(3).animate({"left":680},500)        $lis.eq(4).animate({"left":740},500)    })    $(".li2").mouseenter(function () {        $lis.stop(true);        $lis.eq(1).animate({"left":60},500)        $lis.eq(2).animate({"left":120},500)        $lis.eq(3).animate({"left":680},500)        $lis.eq(4).animate({"left":740},500)    })    $(".li3").mouseenter(function () {        $lis.stop(true);        $lis.eq(1).animate({"left":60},500)        $lis.eq(2).animate({"left":120},500)        $lis.eq(3).animate({"left":180},500)        $lis.eq(4).animate({"left":740},500)    })    $(".li4").mouseenter(function () {        $lis.stop(true);        $lis.eq(1).animate({"left":60},500)        $lis.eq(2).animate({"left":120},500)        $lis.eq(3).animate({"left":180},500)        $lis.eq(4).animate({"left":240},500)    })</script></body></html>为什么我鼠标一上去没有效果

WEB前端全系列/第三阶段:jQuery编程模块/jQuery应用(旧) 15802楼
Python 全系列/第一阶段:Python入门/控制语句 15803楼
Python 全系列/第一阶段:Python入门/控制语句 15804楼
JAVA 全系列/第一阶段:JAVA 快速入门/飞机大战小项目训练 15805楼
JAVA 全系列/第一阶段:JAVA 快速入门/飞机大战小项目训练 15806楼

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>轮播图</title>    <style>        *{            margin: 0;            padding: 0;        }        .box{            width: 560px;            height: 300px;            border: 5px solid grey;            margin: 100px auto;            position: relative;            overflow: hidden;        }        .m_unit{            width: 10000px;            height: 300px;            position: absolute;            top: 0;            left: 0;        }        .m_unit ul{            overflow: hidden;        }        .m_unit ul li{            list-style: none;            width: 560px;            height: 300px;            display: none;            position: absolute;            top: 0px;            left: 0px;        }        .m_unit ul li.current{            display: block;        }        .btn span{            width: 55px;            height: 55px;            border: 2px solid grey;            position: absolute;            top: 50%;            margin-top: -27.5px;            border-radius: 10px;            font-weight: bolder;            font-size: xx-large;            text-align: center;        }        .btn .right{            right: 0;        }        .cirle ul li{            list-style: none;            width: 22px;            height: 22px;            float: left;            background: orange;            margin-right: 10px;            border-radius: 50%;        }        .cirle ul{            overflow: hidden;        }        .cirle{            position: absolute;            bottom: 10px;            right: 10px;        }        .cirle ul li.current{            background: red;        }    </style></head><body><div class="box">    <div class="m_unit">        <ul>            <li class="current"><a href=""><img src="img/0(1).jpg" alt=""></a></li>            <li><a href=""><img src="img/1.jpg" alt=""></a></li>            <li><a href=""><img src="img/2.jpg" alt=""></a></li>            <li><a href=""><img src="img/3.jpg" alt=""></a></li>            <li><a href=""><img src="img/4.jpg" alt=""></a></li>        </ul>    </div>    <div class="btn">        <span class="left" id="leftbtn"><</span>        <span class="right" id="rightbtn">></span>    </div>    <div class="cirle" id="cirle">        <ul>            <li class="current"></li>            <li></li>            <li></li>            <li></li>            <li></li>        </ul>    </div></div><script>    //标识    var idx=0;    var $lis=$(".m_unit ul li");    $("#leftbtn").click(function () {        $lis.eq(idx).fadeOut(300);        idx--;        if(idx<0){            idx=$lis.length-1;        }        $lis.eq(idx).fadeIn(300);        changeCircle()    })    $("#rightbtn").click(function () {        $lis.eq(idx).fadeOut(300);        idx++;        if(idx>$lis.length-1){            idx=0;        }        $lis.eq(idx).fadeIn(300);        changeCircle()    })    //指示器变化    function changeCircle() {        $("#cirle ul li").eq(idx).css("background",'red').siblings().css('background','orange');    }</script></body></html>我的这个为什么实现不了点击按钮轮播

WEB前端全系列/第三阶段:jQuery编程模块/jQuery应用(旧) 15807楼
JAVA 全系列/第一阶段:JAVA 快速入门/飞机大战小项目训练 15808楼
JAVA 全系列/第一阶段:JAVA 快速入门/面向对象详解和JVM底层内存分析 15809楼
JAVA 全系列/第六阶段:项目管理与SSM框架/Mybatis 15810楼

课程分类

百战程序员微信公众号

百战程序员微信小程序

©2014-2025百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园
网站维护:百战汇智(北京)科技有限公司
京公网安备 11011402011233号    京ICP备18060230号-3    营业执照    经营许可证:京B2-20212637