jQuery实现轮播图

浅沫～

已于 2022-09-02 20:33:14 修改

阅读量217

点赞数 1

CC 4.0 BY-SA版权

分类专栏：网站开发《更新中》文章标签： jquery css html

于 2019-06-21 22:34:05 首次发布

本文链接：https://blog.youkuaiyun.com/qq_39579290/article/details/85467560

网站开发《更新中》专栏收录该内容

6 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文详细介绍了如何使用jQuery创建轮播图，包括图片直接显示和滑动显示的代码实现，强调了jQuery库的引入、动画布局以及关键函数的应用，如$(document).ready()、animate()和事件处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一：图片直接显示，代码如下：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <style>
        /*去掉多余的边距*/
        *{margin: 0px;padding: 0px;}
        /*总块*/
        .images{position: relative;background-color: grey;height:500px;width: 1000px;margin: 0 auto;}
        /*图片*/
        .images .image{position: relative;width: 80%;margin: 0px auto;height:100%;}
        .images .image img{position: absolute;width: 100%;height: 100%;}
        /*点*/
        .images .find{position: absolute;right: 10%;bottom:10px;}
        .images .find ul li{float: left;margin-left: 30px;color: cyan;font-size: 50px;}
        /*前进*/
        .images .go{position: absolute;left: 10%;top:260